摘自:http://www.dewen.io/q/1
html结构:
- <div id="container">
- <div id="content">页面正文</div>
- </div>
- <div class="footer"></div>
CSS样式:
- html, body{
- height:100%;
- }
- #container {
- min-height:100%; /*使内容高度和body一样*/
- margin-bottom:-80px;/*向上缩减80像素,不至于footer超出屏幕可视范围*/
- }
- #content {
- padding-bottom:150px; /*这个是关键,处理页面高度超出屏幕可视范围时,控制内容和底部高度之间距离*/
- }
- #footer {
- height:80px;
- }