在没有切换的Bootstrap3中折叠菜单

Question

是否有Bootstrap3组件只是在断点处折叠菜单而不添加切换。例如，如果我在桌面上有一个看起来像这样的水平菜单

屏幕宽度低于768px我希望它只是叠加而不会折叠成这样的切换

有什么想法吗？

Answer 1

删除折叠按钮和navbar-collapse类。从getbootstrap.com示例中，这样的事情可以解决这个问题：

<!-- Fixed navbar -->
<div class="navbar navbar-default navbar-fixed-top">
  <div class="container">
    <div class="navbar-header">
      <a class="navbar-brand" href="#">Project name</a>
    </div>
    <div>
      <ul class="nav navbar-nav">
        <li class="active"><a href="#">Home</a></li>
        <li><a href="#about">About</a></li>
        <li><a href="#contact">Contact</a></li>
      </ul>
    </div>
  </div>
</div>

您必须添加媒体查询以确保将填充添加到移动显示中的内容。

我制作了一个Bootply here，我在其中添加了以下CSS以使其正常工作：

@media screen and (max-width: 768px) {
  #wrap > .container {
    padding-top:200px;
  }
}