javascript - 没有折叠的相同导航栏

Question

我有一个带 Logo 的导航栏，下载应用程序按钮，在菜单中滑动(如图所示)

但是当宽度小于 768 像素时，我希望导航栏看起来像更宽的屏幕 View 一样。但它看起来像这样

带滑动菜单的导航栏:

我试了很多方法都无法得到。 我的代码 http://jsbin.com/neyenanevu/edit?html,css,js,output

Answer 1

更新。您可以找到 bootstrap.css 的所有片段，其中同时提到了 navbar 和 @media (min-width: 768px) .

尝试使用:

.navbar-left {
  float: left !important;
}
.navbar-right {
  float: right !important;
  margin-right: -15px;
}
.navbar-right ~ .navbar-right {
  margin-right: 0;
}
.navbar-nav {
  float: left;
  margin: 0;
}
.navbar-nav > li {
  float: left;
}
.navbar-nav > li > a {
  padding-top: 15px;
  padding-bottom: 15px;
}

http://jsbin.com/nenuquq/edit?html,css,js,output

---

您可以设置导航栏折叠的断点:

1. 在Grid system根据需要设置字段 @grid-float-breakpoint 值。例如，零。

2. 点击页面底部的编译和下载按钮。

3. 从生成的存档中提取文件 bootstrap.css 和 bootstrap.min.css。使用它们代替您网站上的标准文件 bootstrap.css 和 bootstrap.min.css。

4. 根据需要调整导航栏。在任何屏幕宽度下都是一样的。