Bootstrap 手机屏幕自适应的响应式布局开关
发布时间：2018-06-20 14:33:20编辑：丝画阁阅读（1054）
Bootstrap提供了一套响应式布局的解决方案。但是有时候我们需要自己控制是否需要这个响应式布局。
在3.x的bootstrap里面，如果想要开启，需要添加下面的东西：
-
<head>
-
<meta name="viewport" content="width=device-width, initial-scale=1.0">
如果移动设备浏览器里，屏幕太大的话，缩放影响效果，可以禁用缩放。就是再加上 user-scalable=no这个标签。
-
<head>
-
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
如果你想关闭它，官网是这么写的。
-
Omit the viewport <meta> mentioned in the
CSS docs
-
Override the width on the .container for
each grid tier with a single width, for example width: 970px !important; Be
sure that this comes after the default Bootstrap CSS. You can optionally avoid the !important with
media queries or some selector-fu.
-
If using navbars, remove all navbar collapsing and expanding behavior.
-
For grid layouts, use .col-xs-* classes in addition to,
or in place of, the medium/large ones. Don't worry, the extra-small device grid scales to all resolutions.
You'll still need Respond.js for IE8 (since our media queries are still
there and need to be processed). This disables the "mobile site" aspects
of Bootstrap.
其实核心就在于第二步，给整个body的style设置一个width，这样就覆盖掉之前的自响应布局的设置了。