html - Bootstrap 折叠移动导航栏不工作

标签 html css twitter-bootstrap

我有一个导航栏,当它在移动屏幕上打开时,它没有按应有的方式进入小菜单按钮。

如果我在 Chrome 上测试它并缩小屏幕尺寸,导航栏会折叠到移动设备中,但在移动设备屏幕上打开时将无法工作。

我的问题是:是我的导航栏问题吗?我在哪里可以检查导航栏折叠的位置?

这是我的导航栏

  <div class="collapse navbar-collapse col-xs-6 col-sm-6 col-md-6 col-lg-6 col-xs-offset-3 col-sm-offset-3 col-md-offset-3 col-lg-offset-3" id="bs-example-navbar-collapse-1">
      <ul class="nav navbar-nav menu">
        <li id="posts">
          <%= link_to "POSTS", posts_path %>
        </li>
        <li id="athletes">
          <%= link_to "ATLETAS", athletes_path %>
        </li>
        <li id="videos">
          <%= link_to "VIDEOS", videos_path %>
        </li>
        <li id="products">
          <%= link_to "PRODUTOS", products_path %>
        </li>
        <li id="cardapio">
          <%= link_to "CARDAPIO", menus_path %>
        </li>
        <li id="recipes">
          <%= link_to "RECEITAS", recipes_path %>
        </li>
        <li id="contact">
          <%= link_to "QUEM SOMOS", new_contact_path%>
        </li>
        <% if session[:adm] == "true" %>
          <li>
            <%= link_to "SAIR", :controller => "adms", :action => "singOut"%>
          </li>
        <% end %>
      </ul>
    </div><!-- /.navbar-collapse -->
  </div><!-- /.container-fluid -->

最佳答案

我以前遇到过类似的问题,我发现我错过了这条线。

<meta name="viewport" content="width=device-width, initial-scale=1">

关于html - Bootstrap 折叠移动导航栏不工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34617824/

相关文章:

javascript - Bootstrap slider 有 3 个或更多 handle 吗?

javascript - 使用浏览器打印功能生成自定义大小的pdf

html - 居中一个 float 的 div css 级联

javascript - 重置功能,所以当时只有一个打开

javascript - Clickover 不会隐藏在正文中点击首次打开

javascript - 鼠标悬停在菜单项事件处理上的 Bootstrap 下拉菜单停止下拉菜单关闭

html - 为什么 Service Worker 只能通过 HTTPS 工作?

c# - HtmlTable、HtmlTableRow、HtmlTableCell - 创建 thead、tbody 和 tfoot

html - 为什么 × html 实体是 ×

html - 为什么填充在我的 JSF 数据表中不起作用?