为什么我的 Twitter Bootstrap 导航栏样式不适用？

Question

一些背景 - 我正在制作一个 Rails 应用程序 (4.0)。使用 BS3，bootstrap.css 和 bootstrap-theme.css 都在我项目的样式表目录中，bootstrap.js 在我的 javascripts 目录中。其他引导样式可以正常显示，例如 .btn-group、.btn-primary 等。这是我正在尝试创建的导航栏 (HAML)：

.navbar.navbar-fixed-top
    .navbar-inner
        .container
            %a.brand{:href => '#'} Site Name
            %ul.nav
                %li.active
                    %a{:href => '#'} Home
                %li
                    %a{:href => '#'} Link 1
                %li
                    %a{:href => '#'} Link 2

这是它的外观，垂直堆叠而不是水平堆叠，以及缺少样式的“品牌”：http://jsfiddle.net/JLt9u/

我如何使它水平，如网站上所见？我只是使用过时的类名吗？我已经查看了与此相关的所有其他关于 SO 的问题，但似乎都没有答案。任何帮助将不胜感激！

Answer 1

您正在使用带有新样式的旧 (2.x) 标记。正确的标记，取自Bootstrap docs:

<nav class="navbar navbar-default navbar-fixed-top">
  <ul class="nav navbar-nav">
    <li class="active"><a href="#">Home</a></li>
    <li><a href="#">Link 1</a></li>
    <li><a href="#">Link 2</a></li>
  </ul>
</nav>

如果您从 2.x 迁移到 3.0，则有 a docs section for that。