CSS Height 100%
使用纯 CSS 实现 Height 100% 布局。
CSS:
body, html {
border: 0;
margin: 0;
padding: 0;
height: 100%;
position: relative;
width: 100%;
}
#head {
position: absolute;
background-color: #98a;
height: 100px;
width: 100%;
top:0;
}
#footer {
position: absolute;
background-color: #e46;
width: 100%;
height: 20px;
bottom: 0;
}
#content {
position: absolute;
background-color: #dee;
height: auto;
top: 100px;
bottom: 20px;
width: 100%;
}
HTML:
<body>
<div id="head">#head</div>
<div id="footer">#footer</div>
<div id="content">#content</div>
</body>
这里是 Demo。
取自 StackOverflow 上的问答 CSS3 Height 100%。
Enjoy it!