twitter-bootstrap – 如何为“nav-pills”和“nav-stacked”显示“divider”

前端之家收集整理的这篇文章主要介绍了twitter-bootstrap – 如何为“nav-pills”和“nav-stacked”显示“divider”前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
有类似以下代码
<div class="container">

<div class="row">
    <div class="col-sm-3">
        <ul class="nav nav-pills nav-stacked">
            <li><a href="#">Available glyphs</a></li>
            <li class="disabled"><a href="#">How to use</a></li>
            <li><a href="#">Examples</a></li>
            <li class="divider"></li>
            <li><a href="#">Example</a></li>
        </ul>
    </div>
    <div class="col-sm-3">
        <ul class="nav nav-pills nav-stacked">
            <li><a href="#">Basic example</a></li>
            <li><a href="#">Vertical variation</a></li>
            <li class="divider"></li>
            <li><a href="#">Single button dropdowns</a></li>
        </ul>
    </div>
    <div class="col-sm-3">
        <ul class="nav nav-pills nav-stacked">
            <li><a href="#">Basic example</a></li>
            <li><a href="#">CheckBoxes and radio addons</a></li>
            <li class="divider"></li>
            <li><a href="#">Justified</a></li>
        </ul>
    </div>
    <div class="col-sm-3">
        <ul class="nav nav-pills nav-stacked">
            <li><a href="#">Fixed to bottom</a></li>
            <li><a href="#">Static top</a></li>
            <li><a href="#">Inverted navbar</a></li>
        </ul>
    </div>
</div>

class“divider”不起作用。我错过了什么吗?

http://jsfiddle.net/isherwood/B9gHc

解决方法

在Bootstrap 3中,分隔符类已更改为nav-divider。
<li class="nav-divider"></li>

所以你可以使用它而不需要任何自定义CSS。 http://bootply.com/101379

UPDATE

.nav-divider已在v3.0.1中弃用

原文链接:https://www.f2er.com/bootstrap/234170.html

猜你在找的Bootstrap相关文章