标签：
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 <!--gbk,gb2312 中文--> 5 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 6 <!--页面三要素--> 7 <title>DIV+CSS列表式布局</title> 8 <meta name="keywords" content="关键字,关键字" /> 9 <meta name="description" content="描述" /> 10 <!--js css--> 11 <style type="text/css"> 12 body{background:#E6E6E6;font-family:"微软雅黑";font-size:12px;} 13 ul,li,h4,p{margin:0;padding:0;} 14 15 .box{width:960px;height:500px;margin:0 auto;} 16 .box li{width:170px;float:left;list-style:none;background:url(images/icon.png) no-repeat;padding-left:100px;padding-top:10px;margin-bottom:50px;} 17 .box li h4{font-size:28px;font-weight:normal;} 18 p{font-size:14px;margin-top:3px;color:#666;} 19 .box li.i1{background-position:0 -10px;} 20 .box li.i2{background-position:0 -158px;} 21 .box li.i3{background-position:0 -310px;} 22 .box li.i4{background-position:0 -460px;} 23 .box li.i5{background-position:0 -610px;} 24 .box li.i6{background-position:0 -765px;} 25 26 27 </style> 28 </head> 29 30 <body> 31 <ul class="box"> 32 <li class="i1"> 33 <h4>防骚扰</h4> 34 <p>智能拦截垃圾短信和骚扰电话，云识别陌生号码</p> 35 </li> 36 <li class="i2"> 37 <h4>防吸费</h4> 38 <p>扫描并清理吸费应用，时刻管理流量和话费</p> 39 </li> 40 <li class="i3"> 41 <h4>防病毒</h4> 42 <p>国际先进的杀毒引擎，安全防护你的手机</p> 43 </li> 44 <li class="i4"> 45 <h4>一键加速</h4> 46 <p>深度研究拖慢手机应用，让手机提速30%</p> 47 </li> 48 <li class="i5"> 49 <h4>清理垃圾</h4> 50 <p>精细分析系统残留垃圾，每日释放空间1MB</p> 51 </li> 52 <li class="i6"> 53 <h4>应用管理</h4> 54 <p>卸载系统预装应用， 360°管理每一个应用</p> 55 </li> 56 57 58 </ul> 59 60 61 62 </body> 63 </html>
效果：
标签：
原文地址：http://www.cnblogs.com/ChineseMoonGod/p/5203688.html
