CSS 菜單添加箭頭

1.css

View Code

.tabset{
    position: relative;
    overflow:hidden;
    padding:2px 0 0;
}
.tabset .b{
    width:100%;
    overflow:hidden;
    height:1px;
    font-size:0;
    line-height:0;
    background:url(sep1.png) repeat-x;
}
.tabset ul
{
    display: block;
    overflow:hidden;
    padding:0;
    list-style:none;
    margin:0;
}
.tabset ul li{
    float:left;
    margin:0 22px;
    padding: 0 0 17px 0;
    font:bold 21px/23px Arial,Helvetica,sans-serif;
    letter-spacing:-1px;
    color:#f27021;
    position:relative;
    text-shadow: 0 0 3px #000000;
}
.tabset ul li.disable{color:#c57f73;}
.tabset ul li em{
    position:absolute;
    left:40%;
    bottom:0;
    font-size:0;
    line-height:0;
    width:14px;
    height:11px;
}
.tabset ul li.active {color:#fff;}
.tabset ul li.active em{background:url(bul1.png) no-repeat;}

2.html

        <div class="tabset">
                    <ul>
                        <li class=''>档案<em>&nbsp;</em></li>
                        <li class='active'>文件<em>&nbsp;</em></li>
                        <li class=''>信息<em>&nbsp;</em></li>
                        <li class=''>市场<em>&nbsp;</em></li>
                        <li class=''>其他<em>&nbsp;</em></li>
                    </ul>
                    <div class="b">
                        &nbsp;</div>
                </div>

3.效果圖