带有 Bootstrap 3 的非响应式导航栏答案

【问题标题】：Non-responsive navbar with Bootstrap 3带有 Bootstrap 3 的非响应式导航栏
【发布时间】：2013-09-24 22:20:06
【问题描述】：

这是 Bootstrap 3 文档中关于导航栏的 disabling responsivness 的段落：

如果使用导航栏，撤消所有导航栏折叠和展开行为（此处无法展示，请看示例）。

我真的不知道如何禁用响应性。另外，从non-responsive example 我无法理解更多。有人已经这样做了吗？

【问题讨论】：

参见：Bootstrap, remove responsive from navbar 在 SO

标签： twitter-bootstrap twitter-bootstrap-3

【解决方案1】：

检查这个：https://github.com/bassjobsen/non-responsive-tb3 并阅读https://github.com/twbs/bootstrap/issues/10371。

您可以通过在 variables.less 中将 @grid-float-breakpoint 设置为 0 来实现。并重新编译引导程序。

更新正如@fred-k 在 cmets 中所述，上述内容并未使导航栏下拉菜单无响应。要解决此问题，您还必须将 navbar.less 中的 @screen-xs-max 设置为 0。此问题将在以后的版本中修复，请参阅https://github.com/twbs/bootstrap/pull/10465

注意 navbar.less 中的 @screen-xs-max 也会影响 Navbar 表单

【讨论】：

嗨，贝斯。我已经尝试过您的 non-responsive-tbr 并且效果很好，但我更喜欢“破解”官方 Bootstrap 代码。这就是为什么我只要求导航栏的原因。是的，将变量 @grid-float-breakpoint 设置为 0 似乎可以解决，但下拉菜单显示为响应式！我还需要做哪些其他编辑才能完全禁用导航栏响应？谢谢
太好了，贝斯！现在一切似乎都没有反应。在您看来，是否还有其他编辑需要做（我现在看不到）？
对于导航栏不需要其他更改。当你想修复导航栏和内容的宽度时，你应该查看.container 类。有关其他更改，另请参阅：bassjobsen.weblogs.fm/…
至少从 3.1.1 开始，这对我不起作用。更改网格浮动断点没有影响。
@MichaelOryl 首先看到getbootstrap.com/getting-started/#disable-responsive。在less/variables.less 中设置@grid-float-breakpoint: 0; 并通过运行grunt dist 重新编译引导程序也适用于当前的3.1.1。版本。

【解决方案2】：

嗯，关键似乎是构建一个样式表来锁定所有响应式内容。查看http://getbootstrap.com/examples/non-responsive/non-responsive.css，了解他们使用什么来阻止页面响应。您可能可以抬起整张床单。

特别是关于导航栏，如果没有此答案中链接的表格，您将无能为力。话虽如此，该示例没有做的一件事可能是您可能应该删除导航栏折叠时将显示的菜单图标。那就是这段代码：

<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
  <span class="icon-bar"></span>
  <span class="icon-bar"></span>
  <span class="icon-bar"></span>
</button>

【讨论】：