今天小编跟大家讲解下有关利用CSS使footer固定在页面底部的实例代码 ，相信小伙伴们对这个话题应该有所关注吧，小编也收集到了有关利用CSS使footer固定在页面底部的实例代码 的相关资料，希望小伙伴们看了有所帮助。
1. HTML基本结构
XML/HTML Code复制内容到剪贴板 <!DOCTYPEhtml> <htmlxmlnshtmlxmlns="http://www.w3.org/1999/xhtml"> <headrunatheadrunat="server"> <title>layout</title> </head> <body> <divclassdivclass="header"> <h1>headofyourwebsite.</h1> </div> <divclassdivclass="wrapper"> <divclassdivclass="content"> <h2>Yourwebsitecontenthere.</h2> <scripttypescripttype="text/javascript"> for(vari=0;i<100;i++){ document.write(i+"<br/>"); } </script> </div> <divclassdivclass="clear"><!--必不可少--></div> </div> <divclassdivclass="footer"> <div><h1> Copyright(c)2012</h1></div> </div> </body> </html>2. CSS样式
CSS Code复制内容到剪贴板 <styletype="text/css"> *{ margin:0; } html,body { height:100%; width:85%; margin:0auto; } .header { height:100px; background-color:Fuchsia; } .wrapper { min-height:100%; height:auto!important; height:100%; margin:0auto-4em; } .content { background-color:Silver; } .clear { height:4em; clear:both; } .footer { height:4em; background-color:Aqua; } </style>以上这篇利用CSS使footer固定在页面底部的实例代码就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持爱蒂网。
来源：爱蒂网
