With Bootstrap 2,we added optional mobile friendly styles for key
aspects of the framework. With Bootstrap 3,we’ve rewritten the
project to be mobile friendly from the start. Instead of adding on
optional mobile styles,they’re baked right into the core. In
fact,Bootstrap is mobile first. Mobile first styles can be found
throughout the entire library instead of in separate files.
如何禁用响应性?我希望我的网站不会重新排列自己的平板电脑或手机。
解决方法
从Bootstrap documentation(加上一些解释):
To disable responsive features,follow these steps. See it in action
in the modified template below.1) Remove (or just don’t add) the viewport
<Meta>
mentioned in the CSS docs
不言自明
2) Remove the max-width on the
.container
for all grid tiers with
max-width: none !important; and set a regular width like width:
970px;. Be sure that this comes after the default Bootstrap CSS. You
can optionally avoid the !important with media queries or some
selector-fu.
添加此样式:
.container{ max-width: none !important; width: 970px; }
3) If using navbars,undo all the navbar collapsing and expanding
behavior (this is too much to show here,so peep the example).
打开variables.less并设置变量:
@ grid-float-breakpoint为0
@ screen-xs-max为0(这将是固定的;读here)
4) For grid layouts,make use of .col-xs-* classes in addition to or
in place of the medium/large ones. Don’t worry,the extra-small device
grid scales up to all resolutions,so you’re set there.
不言自明
You’ll still need Respond.js for IE8 (since our media queries are still there and need to be picked up). This just disables the “mobile site” of Bootstrap.