是否有任何简洁的纯 CSS 方法可以使绝对定位的 div 元素延伸到文档的底部(而不仅仅是浏览器的窗口)？
本质上，div 元素是模态弹出窗口的背景，覆盖了应用程序的其余部分。它应该覆盖整个页面——从上到下。但是，当内容大于浏览器窗口时，height 仍然只会将元素调整为窗口高度(并且内容流出 div)。
#background{
background-color: green;
position:absolute;
top:0;
bottom:0;
left:0;
right:0;
}
#content{
color: white;
height: 200%; /* simulate a lot of content - just put a large value in here */
}
这样使用:
<body>
<div id="background">
<p id="content">a</p>
</div>
</body>
例如，看http://jsfiddle.net/TuNSy/ : 绿色背景一直延伸到父元素的可见部分，但当您向下滚动时，您会发现它实际上并没有一直延伸到底部。
还有几个其他问题，但它们不适用于我的问题:
- > CSS Div stretch 100% page height : 仅将元素拉伸(stretch)到窗口高度，当内容大于窗口时不起作用。
- > Absolute position background 100% of page height : 说明了问题，但没有公认的答案，原发布者最终使用 JavaScript。
最佳答案
问题是你绝对定位的 div 比你的 body 大，这就是你遇到白色背景问题的原因。如果您只是将 overflow:auto; 添加到您的 #background，它应该可以正确处理溢出
关于html - 在没有 JavaScript 的情况下将绝对定位的 div 拉伸(stretch)到文档高度的 100%，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/23289822/