twitter-bootstrap – 如何从Twitter Bootstrap 3完全关闭响应功能?

前端之家收集整理的这篇文章主要介绍了twitter-bootstrap – 如何从Twitter Bootstrap 3完全关闭响应功能?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
参见英文答案 > How to remove responsive features in Twitter Bootstrap 3?8个答案如何在Bootstrap 3中关闭响应?

我只是想开发一个桌面版本,当大小不同的时候,它仍然应该像桌面版本一样。

Twitter.com这样做如果您尝试调整大小,则在我的站点正在重新设计所有元素时,UI不会发生。

我想要的例子:

无论如何,现在如何关掉责任?所有帮助赞赏

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

谢谢。

解决方法

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

使用col-xs-X类,因为它们是百分比宽度。然后响应速度来自于使用不同介质尺寸的最大宽度的容器。您可以定义自己的.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;
}

猜你在找的Bootstrap相关文章