Question

<nav class="navbar" role="navigation">
  <div class="container">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-navbar-collapse1">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <%= link_to image_tag("erb_logo.png", alt: "Eco Rebox"), root_path, class: "mainlogo navbar-brand" %>
    </div>
    <div class="collapse navbar-collapse" id="bs-navbar-collapse1">
      <ul class="nav nav-pills pull-right">
        <li><%= link_to 'Home', root_path, class: 'first' %></li>
        <li><%= link_to 'News', posts_path, class: 'blog' %></li>
        <li class="dropdown second">
          <a href="about" class="dropdown-toggle" data-toggle="dropdown">
            About <span class="caret"></span>
          </a>
          <ul class="dropdown-menu">
            <li><%= link_to 'Company Profile', about_path %></li>
            <li><%= link_to 'Our Customers', companies_path %></li>
            <li><%= link_to 'What People Are Saying', testimonials_path %></li>
          </ul>
        </li>
        <li class="dropdown third">
          <a href="logistics" class="dropdown-toggle" data-toggle="dropdown">
            Solutions <span class="caret"></span>
          </a>
          <ul class="dropdown-menu">
            <li><%= link_to 'Software', software_path %></li>
            <li><%= link_to 'Sustainability', rethink_path %></li>
            <li><%= link_to 'Logistics & Methodology', restore_path %></li>
          </ul>
        </li>
        <li class="dropdown fourth">
          <a href="products" class="dropdown-toggle" data-toggle="dropdown">
            Products <span class="caret"></span>
          </a>
          <ul class="dropdown-menu">
            <li><%= link_to 'Reusable Boxes', reuse_path %></li>
            <li><%= link_to 'Shipping Containers', shipping_path %></li>
          </ul>
        </li>
        <li><%= link_to "Contact", contact_path, class: 'fifth' %></li>
        <% if signed_in? %>
        <li class="dropdown sixth">
          <a href="user" class="dropdown-toggle" data-toggle="dropdown">
            My Account <span class="caret"></span>
          </a>
          <ul class="dropdown-menu">
            <li><%= link_to "Dashboard", current_user %></li>
            <li><%= link_to "Settings", edit_user_path(current_user) %></li>
            <li class="divider"></li>
            <li><%= link_to "Sign out", signout_path, method: "delete" %></li>
          </ul>
        </li> 
        <% else %>  
        <li><a href="#signinModal" role="button" data-toggle="modal">Sign in</a></li>
        <% end %> 
      </ul>
    </div> <!--/.navbar-header -->
  </div> <!--/.container -->
</nav>

所以......这是一个标题菜单......但不是默认菜单。 http://www.ecorebox.com/ - 你可以在那里看到它。我正在努力让响应式菜单工作。我之前已经设置好了，但是使用了default-navbar。我相信，在{x}模式下，<navbar-header>部分应该呈现一个显示/隐藏菜单的按钮。但是，我似乎无法让它发挥作用。

非常感谢任何帮助！

Answer 1

    <div class="collapse navbar-collapse" id="bs-navbar-collapse1">

以上内容并未包含在菜单中。

但是，您还有其他错误。通过验证器运行它，修复错误。确保崩溃围绕您想要折叠的东西。

没有任何东西出现在icon-bar中，所以你需要解决的问题是药丸也不会堆叠在小尺寸上，但这里有效。

http://jsbin.com/USEhecUZ/1/

菜单切换与BS3和导航丸

1 个答案: