Bootstrap Navbar折叠按钮问题

我复制了这个引导模板。我有一个问题是，当它处于移动模式（小屏幕）时，它不会在汉堡内显示侧边栏菜单（仪表板，菜单，内容，类别等）。我该如何解决它？Bootstrap Navbar折叠按钮问题

我的HTML代码：

<body> 
    <nav class="navbar navbar-inverse navbar-fixed-top"> 
     <div class="container-fluid"> 
     <div class="navbar-header"> 
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"> 
      <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="{{ url('cms/dashboard')}}">Myhero admin panel</a> 
     </div> 
     <div id="navbar" class="navbar-collapse collapse"> 
      <ul class="nav navbar-nav navbar-right"> 
       <li><a target="blank" href="{{ url('')}}">Back to site</a></li> 
      <li><a href="{{ url('user/logout')}}">Logout</a></li>     
      </ul>     
     </div> 
     </div> 
    </nav>  
    <div class="container-fluid"> 
     <div class="row"> 
     <div class="col-xs-2 col-sm-3 col-md-2 sidebar "> 
      <ul class="nav nav-sidebar "> 
      <li><a href="{{ url('cms/dashboard')}}">Dashboard</a></li> 
      <li><a href="{{ url('cms/menu')}}">Menu</a></li> 
      <li><a href="{{ url('cms/content')}}">Content</a></li> 
      <li><a href="{{ url('cms/categories')}}">Categories</a></li> 
      <li><a href="{{ url('cms/products')}}">Products</a></li> 
      <li><a href="{{ url('cms/orders')}}">Orders</a></li> 
      </ul> 
     </div> 
     </div> 
     <div class="row"> 
     <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main"> 
      @include ('inc.sm') 
      @include ('inc.errors') 
     </div> 
     </div> 
     @yield('cms_content') 
    </div> 
    </body>

来源

2017-08-04 Valerie Kurt

可以在CSS被achived请提供你的CSS脚本 –

@WojtekT我没有为这一个 –

您将需要包括引导例如'<链接的rel =“样式表的” href任何CSS =“HTTPS ：//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css“>'如果你不知道你的代码会遍布整个地方。 –

如果禁用JavaScript和视口就足够了导航栏崩溃窄，就不可能扩大导航栏和查看.navbar崩溃中的内容。

响应式导航栏需要将崩溃插件包含在您的Bootstrap版本中。为确保您拥有最新的引导工作版本，您可以使用cdn来提供所需的JavaScript文件。

<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity=[...]>

来源

2017-08-04 11:37:33 JuSolyj

您可以在上面的注释中使用与Wojtek提到的CSS相同的方法。 – JuSolyj

我的代码里有bootstrap cdn，我只是没把它放在这里，因为它与我的问题无关:) –

好的。谢谢（你的）信息。控制台中是否显示任何内容？例如，当你点击汉堡时。 – JuSolyj

Bootstrap Navbar折叠按钮问题

回答

相关问题