如何使用 Twitter bootstrap-responsive 更改导航栏折叠阈值? [英] How to change navbar collapse threshold using Twitter bootstrap-responsive?

问题描述

我在 Rails 3.1.2 项目中使用 Twitter Bootstrap 2.0.1，通过 bootstrap-sass 实现.我正在加载 bootstrap.css 和 bootstrap-responsive.css 文件，以及 bootstrap-collapse.js Javascript.

I'm using Twitter Bootstrap 2.0.1 in a Rails 3.1.2 project, implemented with bootstrap-sass. I'm loading both the bootstrap.css and the bootstrap-responsive.css files, as well as the bootstrap-collapse.js Javascript.

我有一个带有类似于 example 的导航栏的流畅布局.这遵循 此处 的导航栏响应式变体"说明.它工作正常:如果页面窄于大约 940 像素，导航栏会折叠并显示一个按钮"，我可以点击该按钮展开.

I have a fluid layout with a navbar similar to the example. This follows the navbar "responsive variation" instructions here. It works fine: if the page is narrower than about 940px, the navbar collapses and displays a "button" that I can click on to expand.

但是我的导航栏在大约 550 像素宽时看起来不错，也就是说，除非屏幕非常窄，否则不需要折叠它.

However my navbar looks good down to about 550px wide, i.e. it doesn't need to be collapsed unless the screen is very narrow.

如果屏幕宽度小于 550 像素，我如何告诉 Bootstrap 仅折叠导航栏?

How do I tell Bootstrap to only collapse the navbar if the screen is less than 550px wide?

请注意，此时我不想想要修改其他响应行为，例如堆叠元素而不是并排显示.

Note that at this point I do not want to modify the other responsive behaviors, e.g. stacking elements instead of displaying them side by side.

推荐答案

您正在寻找 bootstrap-responsive.css

@media (max-width: 979px) {...}

其中 max-width 值触发响应式导航.将其更改为 550px 左右，它应该可以很好地调整大小.

Where the max-width value triggers the responsive nav. Change it to 550px or so and it should resize fine.

这篇关于如何使用 Twitter bootstrap-responsive 更改导航栏折叠阈值?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！