页脚，无论内容是否满屏页脚均在底部

2024-04-27 15:15:44

字体：大中小

来源：转载

供稿：网友

话不多说，直接上代码：

<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <style type="text/CSS"> body,html { margin: 0; padding: 0; height:100%; } #main { position: relative; min-height:100%; background:#eee; } #content { padding: 10px; padding-bottom: 100px; } #footer { position: absolute; bottom: 0; height: 100px; width: 100%; background:lightblue; } </style> </head> <body> <div id="main"> <div id="content"> <script type="text/javascript"> for(var i=0; i<400; i++){ document.write(i+'<br/>'); } </script> </div> <div id="footer"> Footer </div> </div> </body> </html> 
参考链接：
http://www.jb51.net/css/102575.html【方案一】
http://www.w3cplus.com/css/css-sticky-foot-at-bottom-of-the-page

上一篇：浮动总结

下一篇：定位总结