项目最终效果如下图所示:
可以看出2个tab之间有一天分割线,这条分割线没有使用单独的div或者span。而是使用li标签的border-right。但是最后一个需要隐藏,否则效果不是很理想。
最原始的写法是:
1: #tabnav li:last-child
2: {
3: border-right:none;
4: }
<li id="sub_nav_user" class="dcontent lastitem" ><a >D Content</a></li>
$("#tabnav li:last").addClass("lastitem");
#tabnav .lastitem
{
border-right:none;
}
这样当然不是最好的做法。但是我们有时需要转变思路,这样有时可以达到事半功倍的效果。