首页 > 代码库 > tab.html

tab.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" xml:lang="en">
  3 <head>
  4     <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
  5     <title>Document</title>
  6     <style type="text/css">
  7         *{
  8             margin: 0;
  9             padding: 0;
 10         }
 11         ul,li{
 12             list-style: none;
 13         }
 14         body{
 15             font-size:12px;
 16         }
 17         a{
 18             text-decoration: none;
 19         }
 20         a:link,a:visited{
 21             color:blue;
 22         }
 23         a:hover{
 24             color:red;
 25         }
 26         .clear{
 27             clear:both;
 28         }
 29         .box{
 30             width:320px;
 31             margin:100px auto;
 32         }
 33         .box .top{
 34             border-bottom:3px solid #C2130E;
 35             height:20px;
 36             line-height:20px;
 37         }
 38         .box .top ul li{
 39             float:left;
 40             width:50px;
 41             background: #DCDCDC;
 42             text-align: center;
 43             margin-right: 1px;
 44         }
 45         .box .top ul .xwph{
 46             width:100px;
 47             text-align: center;
 48             background: white;
 49             font-weight: bold;
 50         }
 51         .box .top ul .guonei{
 52             background: #C2130E;
 53             color:white;
 54         }
 55         .box .content ul{
 56             background: url(images/bg.gif) no-repeat 9px 7px;
 57         }
 58         .box .content ul li{
 59             height:26px;
 60             line-height:26px;
 61             padding-left:35px;
 62         }
 63         .box .content ul li a:link,.box .content ul li a:visited{
 64             color:#C0C0C0;
 65         }
 66         .box .content ul li a:hover{
 67             color:red;
 68         }
 69         .box .content .more{
 70             text-align: right;
 71             padding-right:15px;
 72         }
 73         .box .content .more a:link,.box .content .more a:visited{
 74             color:#C0C0C0;
 75         }
 76         .box .content .more a:hover{
 77             color:red;
 78         }
 79     </style>
 80 </head>
 81 <body>
 82     <div class="box">
 83         <div class="top">
 84             <ul>
 85                 <li class=‘xwph‘>新闻排行</li>
 86                 <li class=‘guonei‘>国内</li>
 87                 <li>国际</li>
 88                 <li>社会</li>
 89                 <li>网评</li>
 90             </ul>
 91         </div>
 92         <div class="clear"></div>
 93         <div class="content">
 94             <ul>
 95                 <li><a href=‘#‘>新疆阜康铁路桥梁坍塌多节运煤车厢侧翻坠河</a></li>
 96                 <li><a href=‘#‘>最高法:承诺不判赖昌星死刑没有超越法律程序</a></li>
 97                 <li><a href=‘#‘>物权法:满70年住宅建设用地使用权将自动续期</a></li>
 98                 <li><a href=‘#‘>弟弟被妻下药毒死男子买女尸为其配阴婚(图)</a></li>
 99                 <li><a href=‘#‘>揭开郑州神枪手神秘面纱 头号狙击手是近视眼</a></li>
100                 <li><a href=‘#‘>美军高官:不排除和中国发生直接军事对抗可能</a></li>
101                 <li><a href=‘#‘>浙江东阳传奇富姐吴英涉嫌非法吸收存款被批捕</a></li>
102                 <li><a href=‘#‘>西方炒作"中国航母威胁论"称05年已正式服役</a></li>
103                 <li><a href=‘#‘>女孩生活无法自理请人大代表递交安乐死议案</a></li>
104                 <li><a href=‘#‘>建设部:住房公积金制度将覆盖农民工</a></li>
105             </ul>
106             <div class=‘more‘><a href="#">...more</a></div>
107         </div>
108     </div>
109 </body>
110 </html>

 

tab.html