如何从Twitter Bootstrap 3完全关闭响应功能？

Question

如何在Bootstrap 3中关闭响应？

我只是想开发一个桌面版本,当尺寸不同时,它应该仍然像桌面版本.

Twitter.com这样做.如果您尝试调整大小,当我的网站重新设计所有元素时,UI没有任何反应.

我想要它的例子:

无论如何现在如何关闭响应？所有帮助赞赏.

最近还读到,在Bootstrap 2.0中你只需要删除响应的boostrap CSS,但在3.0中它被烘焙成一个css文件.

谢谢.

Answer 1

编辑:我的代码是为v3.0.0RC2编写的,但是在v3.0.0中,文档专门针对这个问题编写了一个部分:http://getbootstrap.com/getting-started/#disable-responsive

使用col-xs-X类,因为它们是恒定的百分比宽度.然后响应性来自于.container使用max-width不同的媒体大小.您可以定义自己的替代方案.container并使用其他所有内容,例如:

以下示例的小提琴:http://jsfiddle.net/xTePL/

HTML:

<!-- Don't use .container at all or you will have to
     override a lot of responsive styles. -->
<div class="container-non-responsive">
  <div class="row">
    <div class="col-xs-4">
      <h1>Welcome to Non-responsive Land</h1>
    </div>
    <div class="col-xs-8">
      <!-- More content, more content -->
    </div>
  </div>
</div>

CSS:

.container-non-responsive {
  /* Margin/padding copied from Bootstrap */
  margin-left: auto;
  margin-right: auto;
  padding-left: 15px;
  padding-right: 15px;

  /* Set width to your desired site width */
  width: 1170px;
}

Answer 2

这对我有用:

<meta name='viewport' content='width=1190'>

我想在我的内容周围留一点余地,所以我也做了

.container{
  width: 1150px !important;
}

在iPad和iPhone上测试过.