默认情况下，Bootstrap 3 真的响应吗？答案

【问题标题】：Is Bootstrap 3 really responsive by default?默认情况下，Bootstrap 3 真的响应吗？
【发布时间】：2014-03-08 19:55:15
【问题描述】：

我需要使用 bootstrap 3 和其他 web 技术（如 angular 等）创建一个新的应用程序小部件。我知道新版本的 bootstrap 是响应式的。阅读文档后我的理解是，我将创建的小部件将自动响应。我不需要做任何特别的事情来让它响应。但是，如果我想让它无响应，那么我需要进行必要的更改以禁用引导程序 3 的此功能。

请问我在这方面对Bootstrap的理解是否正确？

【问题讨论】：

对于 SO (IMO) 来说太宽泛了：不。编写一个简单的“Hello World”HTML 页面，包括 Bootstrap。它反应灵敏吗？不，您必须将布局设置为响应式（以及其他各种内容）。 Bootstrap 让它变得非常简单。
谢谢阿德里亚诺，您能否分享一个链接，我可以在其中获得响应式布局的指南？
这里有你需要知道的一切，包括禁用响应能力：getbootstrap.com/getting-started

标签： responsive-design twitter-bootstrap-3

【解决方案1】：

我认为这将帮助您更多地了解 Bootstrap。

您提到“我将创建的小部件将自动响应”。但是如果你没有在你的小部件中应用 Bootstrap CSS 规则，即使它在 Bootstrap 模板内部也不会响应。

我们必须在设计中应用 Bootstrap CSS 规则才能生效并做出响应。如果您不希望特定元素具有响应性，请在您想要的断点上应用您自己的 CSS 规则或媒体查询...

Bootstrap CSS http://getbootstrap.com/css/的链接

希望这会对您有所帮助。干杯! (='.'=)

【讨论】：

【解决方案2】：

这就是你需要做的所有事情：

禁用页面响应的步骤省略 CSS 文档中提到的视口使用单个宽度覆盖每个网格层的 .container 宽度，例如 width: 970px !important;确保它出现在默认的 Bootstrap CSS 之后。您可以选择使用媒体查询或某些选择器来避免 !important。如果使用导航栏，请删除所有导航栏折叠和展开行为。对于网格布局，使用 .col-xs-* 类来补充或代替中/大型类。别担心，超小的设备网格可以扩展到所有分辨率。对于 IE8，您仍然需要 Respond.js（因为我们的媒体查询仍然存在并且需要处理）。这会禁用 Bootstrap 的“移动网站”方面。

禁用响应的引导模板我们已将这些步骤应用于示例。阅读其源代码以查看实现的具体更改。

非响应式模板：http://getbootstrap.com/examples/non-responsive/

【讨论】：