Question

#order {
    font-family: HelveticaLTStd-Light;
    font-size:13;
    position: absolute;
    right:218;
    top:-5;
}

    #order ul li {
        float:left;
        padding: 5px;
        border-right: 1px solid;
    }

    <div id="order">
    <ul>
        <li>Order</li>
        <li>Account</li>
        <li>Login</li>
    </ul>
    </div>

我计划删除登录旁边的边框，中间的两个将保留但是我找不到答案请帮帮忙？：）

订单|帐户|登录

Answer 1

你可以使用伪类：first-child完全没有边框，其余部分都有左边框，有效地只在

元素之间显示垂直边框。

   #order ul li:first-child {
    float:left;
    padding: 5px;
    border: none;
}

#order ul li {
    float:left;
    padding: 5px;
    border-left: 1px solid;
}

显示小提琴

http://jsfiddle.net/AJW2a/

Answer 2

给它一个类，然后为该类指定一个没有右边框。看看：

HTML：

<div id="order">
<ul>
    <li>Order</li>
    <li>Account</li>
    <li class="noRight">Login</li>
</ul>
</div>

CSS：

#order {
    font-family: HelveticaLTStd-Light;
    font-size:13;
    position: absolute;
    right:218;
    top:-5;
}

#order ul li {
    float:left;
    padding: 5px;
    border-right: 1px solid;
}

#order ul li.noRight {
    border-right:0;
}

对你说JSFiddle。

仅在一侧删除边框<li>（保持分割边框）</li>

2 个答案: