css tabs 2.0 我的修改版

unraveled CSS Tabs 2.0,http://unraveled.com/publications/css_tabs/,在body上加了一个id属性,看得极度不爽,改了它:

效果先:

20091031112010937

html:

<ul id="tabnav">
  <li><a class="tabcurrent" href="Tab_1.html">tab one</a></li>
  <li><a href="Tab_2.html">tab two</a></li>
  <li><a href="Tab_3.html">tab three</a></li>
  <li><a href="Tab_4.html">tab four</a></li>
</ul>

css:

ul#tabnav {
    border-bottom: #6c6 1px solid;
    padding: 3px 10px 3px 10px;   
    list-style-type: none;
}
ul#tabnav li {
    display: inline;
}
ul#tabnav li a {
    border:#6c6 1px solid;
    border-bottom:#6c6 0px solid;/*去除下边框线*/
    padding:3px 4px 3px 4px;
    background-color: #cfc;
    text-decoration: none;
}
ul#tabnav li a:hover{
    background: #fff;
}

ul#tabnav li a.tabcurrent{
    background-color:#fff;
    position: relative;  /*相对位置*/
    top: 1px;  /*相对位置,移下1px遮住下边框*/
}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值