html - 显示地址栏时的 100vh 高度

我几次遇到这个问题，想知道是否有解决这个问题的方法。我的问题出现在 Chrome 移动应用程序上。在那里，您可以向下滚动一点，地址栏就会消失。到目前为止，一切都很好，让我们举个例子：
容器的height设置为100vh.

如您所见，底部被切断。

当我向下滚动时，它看起来像这样：

现在看起来不错。所以很明显，Chrome 将地址栏的高度计算为视口高度。所以我的问题是：

有没有办法，不管有没有地址栏，它看起来都一样？这样容器会膨胀还是什么？

标签： htmlcssgoogle-chromeaddress-barmobile-chrome

根据Chrome web 上的这篇官方文章，设置高度以填充可见视口的正确方法是height: 100%在<html>元素或position: fixed元素上使用。如文档所述，这确保了与移动 Safari 的兼容性，并且与 URL 栏的大小无关。

html - 显示地址栏时的 100vh 高度 - Chrome Mobile