为什么我的Bootstrap导航栏不是很响应？

Question

我编写了一个带有三个链接的导航栏.导航栏应该是响应的,这意味着如果窗口变得足够小,链接应该消失(就像它们那样),并且应该出现一个带有三条水平线的新按钮(没有).

<nav class="navbar navbar-fixed-top" role="navigation">
    <div class="navbar-inner">
        <div class="container">
            <!-- Brand and toggle get grouped for better mobile display -->
            <div class="navbar-header">

                <button type="btn btn-navbar" class="navbar-toggle"
                    data-toggle="collapse"
                    data-target=".navbar-ex1-collapse">
                    <span class="sr-only">Toggle navigation</span> <span
                        class="icon-bar"></span> <span
                        class="icon-bar"></span> <span
                        class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="/server">APL</a>
            </div>


            <!-- Collect the nav links, forms, and other content for toggling -->
            <div
                class="collapse navbar-collapse navbar-ex1-collapse">
                <ul class="nav navbar-nav">
                    <li class="active"><a href="impressum.html">Impressum</a></li>
                    <li class="active"><a href="documentation.html">Documentation</a></li>
                </ul>
            </div>
        </div>
    </div>
</nav>

为什么以下JSFiddle演示中的按钮保持不可见(相同的标记)？

http://jsfiddle.net/BaR3q/22/

Answer 1

菜单按钮在那里,但它是白色的,所以你看不到它.

将navbar-inverse类添加到导航栏并显示:

http://jsfiddle.net/BaR3q/23/

UPDATE

您的原始问题仅询问"为什么以下JSFiddle演示中的按钮保持不可见",而我上面的jsfiddle示例解决了这个问题.但根据你下面的评论,我再次看了你的jsfiddle.

菜单按钮没有切换菜单的原因是你没有有效的链接,bootstrap.min.js也没有预加载jQuery.添加两者后,您可以看到您的演示工作:http://jsfiddle.net/BaR3q/25/