将 div 设为视口的高度答案

【问题标题】：Make div the height of viewport将 div 设为视口的高度
【发布时间】：2013-02-05 05:23:14
【问题描述】：

我正在设计一个网站，我希望顶部是这样的视口高度 website.

我该怎么做这样的事情？

无论我使用什么显示器，底部总是位于屏幕底部？

谢谢

【问题讨论】：

【解决方案1】：

您可以通过设置将分隔线设置为与窗口相同的高度：

html, body { height:100%; margin:0; padding:0; }
div { height:100%; }

这个问题在这里被问了很多，最好先搜索一下。 :-)

【讨论】：

【解决方案2】：

我知道这是一个老问题，但您也可以使用 vh（视口高度）单位。所有现代 ~~desktop~~ 浏览器都支持它，~~在移动设备上可能会产生一些问题，因此请使用媒体查询解决它~~。

div {height:100vh;}

表示视口高度的 100%。

Here 是指定相对长度单位的 W3C 草案，在您使用其中任何一个之前，请检查 Internet Explorer 支持，因为它不支持每个单位。

【讨论】：