我有一个包含两列的布局—左div和右div
右边的div有一个灰色的背景色，我需要它根据用户浏览器窗口的高度垂直展开。现在，背景色在该div中的最后一段内容处结束
我试过身高：100%，最小身高：100%，等等
有两个CSS 3测量单位，称为：
视口百分比（或相对视口）长度
视口百分比长度是多少
从上面链接的W3候选推荐中：
视口百分比长度相对于初始包含块的大小。当初始包含块的高度或宽度更改时，它们将相应地缩放。
这些单位是vh（视口高度）、vw（视口宽度）、vmin（视口最小长度）和vmax（视口最大长度）
如何使分隔符填充浏览器的高度
对于这个问题，我们可以使用vh：1vh等于视口高度的1%。也就是说，100vh等于浏览器窗口的高度，无论元素位于DOM树中的何处：
HTML
<；部门></部门>；
CSS
div{
高度：100vh；
}
这就是所需要的一切。下面是一个正在使用的JSFiddle示例
哪些浏览器支持这些新单元
目前，除了Opera Mini之外，所有最新的主要浏览器都支持此功能。退房我可以用。。。寻求进一步支持
如何将其用于多个列
对于手头的问题，有一个左分隔符和一个右分隔符，下面是一个JSFIDLE示例，显示了一个包含vh和vw的两列布局
100vh与100%有何不同
以这种布局为例：
<；车身风格=”车身风格“；高度：100%“&燃气轮机；
<；div style="；高度：200px“&燃气轮机；
<；p样式=”的；身高：100%；显示：块&引用&燃气轮机；你好，世界</p>；
</部门>；
</车身>；
此处的p标记设置为100%高度，但由于其包含div的高度为200像素，因此200像素的100%变为200像素，而不是主体高度的100%。改用100vh意味着p标签将是主体的100%高度，而不考虑div的高度。看看这个附带的JSFIDLE，很容易看出其中的区别