Question

我正在尝试实现如下所示的可堆叠效果： http://twitter.github.com/bootstrap/components.html#navs

但不知何故，它对我不起作用。这是我创建的plunk的链接： http://plnkr.co/edit/LSR3ijKGiOIyrYAbHm7g 它只显示了一个低于另一个的三个列表项而没有bootstrap的导航栏效果。

<!doctype html>
<html>
<head>
    <link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css" rel="stylesheet">
    <script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/js/bootstrap.min.js"></script>

</head>

<body>
    <div class="row-fluid">
        <div class="offset4 span4">
            <ul class="nav nav-tabs nav-stacked">
                <li> Item1</li>
                <li> Item2</li>
                <li> Item3</li>
            </ul>
        </div>
    </div>
</body>
</html>

我必须犯一些错误，就像导航堆叠这样简单的东西不起作用。如果有人能指出我的错误，会很高兴和感激。

Answer 1

将内容放在锚点中，如下所示：

<ul class="nav nav-tabs nav-stacked">
    <li class="active"><a href="#">Item1</a></li>
    <li><a href="#">Item2</a></li>
    <li><a href="#">Item3</a></li>
</ul>

演示：http://jsfiddle.net/jpKAF/

Twitter bootstrap nav-stacked css无法正常工作

1 个答案: