无背景图片,纯CSS+DIV 选项卡效果

[ 2008年6月25日 ]
Tags:  选项卡效果  

<style type="text/css">
div#mynav {
     border-bottom: 1px solid #70A1CA;
}
ul#mynavlist{
margin-top: 4px;
margin-bottom: 3px;
}
ul#mynavlist li {
display: inline;
}
ul#mynavlist li a{
padding: 3px 9px;
border: 1px solid #70A1CA;
background: #F4F9FE;
text-decoration: none;
}
ul#mynavlist li a:hover{
border-bottom: 1px solid white;
}
</style>
以下部分放入<body>和</body>之间。
<div id="mynav">
     <ul id="mynavlist">
     <li><a href="#">产品</a></li>
<li><a href="#">玩家</a></li>
<li><a href="#">评测</a></li>
<li><a href="#">市场</a></li>
</ul>
</div>
 

相关文章:
发布:babycrazy | 分类:IT文献 | 评论:0 | 引用:0 | 浏览:
发表评论