我有一个包含文本内容的 div。我希望 div 高度扩展到浏览器窗口( View 区域)的整个高度，即使它的内容没有那么高。
如果内容使其溢出窗口的高度，我想要默认行为。即出现滚动条并且div高度与 View 区域高度不同。
我在 jsfiddle http://jsfiddle.net/bernard/gLjYg/16/ 上放了一些代码.黄色边框应该覆盖整个窗口区域，除非您减小窗口的大小以使不是所有的文本都可见。在这种情况下，文本应该是可滚动的，底部或顶部边框将被隐藏。
index.html
<!-- language: lang-html -->
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title></title>
</head>
<body>
<div id="container">
<div class="main">
<h1>Think of a Nat Geo frame</h1><br>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.
</div>
</div>
</body>
</html>
样式.css
body, html {
margin: 0;
background-color: #c0c0c0;
}
#container {
border: 20px solid yellow;
}
.main {
background-color: white;
padding: 2em;
}
标记并不是那么重要。但是，我想避免使用非语义 div。我也更喜欢基于 CSS 的解决方案。
最佳答案
关于jquery - 如果内容较小，则 Div 扩展到窗口的全高，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/11775080/