标签：.com html body font round meta style utf-8 charset
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title></title> 6 <style> 7 *{ 8 margin: 0; 9 padding: 0; 10 } 11 a{ 12 text-decoration: none; 13 } 14 15 /*大体div*/ 16 .big{ 17 width: 300px; 18 height: 310px; 19 margin: 100px auto; 20 } 21 /*顶部*/ 22 .top{ 23 text-align: center; 24 height: 25px; 25 line-height: 25px; 26 border-bottom: 2px solid darkred; 27 } 28 h4{ 29 float: left; 30 width: 90px; 31 } 32 .top a{ 33 float: left; 34 width: 50px; 35 color: black; 36 display: block; 37 margin-left: 2px; 38 font-size: 14px; 39 background-color: gainsboro; 40 } 41 .top a:hover{ 42 background-color: darkred; 43 color: white; 44 } 45 46 /*news 新闻*/ 47 .new{ 48 height: 280px; 49 } 50 .new ul{ 51 background: url(bg.gif) no-repeat 5px 9px; 52 padding-left: 28px; 53 } 54 .new li{ 55 font-size: 13px; 56 list-style: none; 57 line-height:29px; 58 } 59 .new li a{ 60 color: gray; 61 display: block; 62 width:270px; 63 height:29px ; 64 } 65 .new li a:hover{ 66 color: #8B0000; 67 color: white; 68 background-color:darkred ; 69 } 70 /*more 更多*/ 71 p{ 72 text-align: right; 73 font-size: 13px; 74 } 75 p a{ 76 color: gray; 77 } 78 </style> 79 </head> 80 <body> 81 <div class="big"> 82 <div class="top"> 83 <h4>新闻排行</h4><a href="#">国内</a><a href="#">国内</a><a href="#">国内</a><a href="#">国内</a> 84 </div> 85 <div class="new"> 86 <ul> 87 <li><a href="#">广州传智播客php基础班23期 312室</a></li> 88 <li><a href="#">广州传智播客php基础班23期 312室</a></li> 89 <li><a href="#">广州传智播客php基础班23期 312室</a></li> 90 <li><a href="#">广州传智播客php基础班23期 312室</a></li> 91 <li><a href="#">广州传智播客php基础班23期 312室</a></li> 92 <li><a href="#">广州传智播客php基础班23期 312室</a></li> 93 <li><a href="#">广州传智播客php基础班23期 312室</a></li> 94 <li><a href="#">广州传智播客php基础班23期 312室</a></li> 95 <li><a href="#">广州传智播客php基础班23期 312室</a></li> 96 </ul> 97 </div> 98 <p><a href="#">...more</a></p> 99 </div> 100 </body> 101 </html>
标签：.com html body font round meta style utf-8 charset
原文地址：http://www.cnblogs.com/xdtx/p/6132144.html
