页脚footer始终显示在底部的布局代码

　　烈火网(LieHuo.Net)教程 今天看了一个国外的网页，其网页即使内容很少的情况下，它也始终在页面的底部。否则页面底部将留下大量空白。footer位置自适应，现在把代码发出来给大家看一下。

<style> html, body, #wrap {height: 100%;} body > #wrap {height: auto; min-height: 100%;} #main {padding-bottom: 150px;} /* 必须使用和footer相同的高度 */ #footer {position: relative; margin-top: -150px; /* footer高度的负值 */ height: 150px; background: #ddd; clear: both;} .clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;} .clearfix {display: inline-block;} /* Hides from IE-mac */ * html .clearfix {height: 1%;} .clearfix {display: block;} /* End hide from IE-mac */ </style> <div id="wrap"> <div id="main" class="clearfix"> <div id="content"> 烈火网 </div> <div id="side"> 关注站长，建设互联网 </div> </div> </div> <div id="footer"> copyright © 2009 Liehuo.net </div><br /><center>如不能显示效果，请按Ctrl+F5刷新本页，更多网页代码：<a href='http://www.veryhuo.com/' _fcksavedurl='http://www.veryhuo.com/' target='_blank'>http://www.veryhuo.com/</a></center>
提示：可修改后代码再运行!

（编辑：成都站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!