1、公共默认样式（Gloabl）
1 @charset "utf-8"; 2 /* Gloabl */ 3 body, div,iframe, ul, ol, dl, dt, dd, li, dl, 4 h1, h2, h3, h4, table,th, td, input, button, select,textarea {margin:0; padding:0; 5 font-style: normal;font:12px/1.5 "5FAE8F6F96C59ED1","宋体",Arial, Helvetica, sans-serif;} 6 /* 5FAE8F6F96C59ED1 微软雅黑 转换Unicode编码表网址 http://tool.lu/fontfamily/ */ 7 ol, ul ,li{list-style: none;} 8 img {border: 0; vertical-align:middle;} 9 body{color:#000000;background:#FFF; text-align:center;} 10 11 a{color:#000000;text-decoration:none; } 12 a:hover{color:#F00;text-decoration:none;} 13 14 .fl{float:left;} 15 .fr{float:right;} 16 /*清除浮动代码*/ 17 .clear:after{display:block;clear:both;content:"";visibility:hidden;height:0} 18 .clear{zoom:1} /*原理：IE8以上和非IE浏览器才支持:after，原理和方法2有点类似，zoom(IE转有属性)可解决ie6,ie7浮动问题 */ 19 20 .mt10{margin-top:10px} 21 .mb10{margin-bottom:10px} 22 .pt10{padding-top:10px;} 23 .pb10{padding-bottom:10px;} 24 25 .head,.main,.foot{ margin:0 auto; width:1000px; overflow:hidden}
1.1清除浮动（核心代码） CSS清除浮动大全共8种方法：http://www.jb51.net/css/173023.html
.clear:after{ content:""; display:block; clear:both; } .clear{ zoom:1; }
2、html模板
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 6 <meta name="renderer" content="webkit"> <!--若页面需默认用极速内核，增加此标签--> 7 <title>基础网页模板</title> 8 <meta name="Keywords" content="" /> 9 <meta name="description" content="" /> 10 <meta name="author" content=""> 11 <link type="text/css" rel="stylesheet" href=""/> 12 </head> 13 14 <body> 15 <div class="warp"> 16 <!--头部--> 17 <div class="head"> 18 <!--logo--> 19 <div class="header"></div> 20 <!--主导航--> 21 <div class="nav"></div> 22 </div> 23 <!--/头部--> 24 25 26 <!--主体--> 27 <div class="main"> 28 29 </div> 30 <!--/主体--> 31 32 <!--底部--> 33 <div class="foot"> 34 35 </div> 36 <!--/底部--> 37 38 </div> 39 40 <script type="text/javascript" language="javascript" src=""></script> 41 </body> 42 </html>