在bootstrap 3中禁用一些响应级别?

时间:2013-09-06 04:07:14

标签: twitter-bootstrap responsive-design twitter-bootstrap-3

在Bootstrap 3中禁用某些响应级别的最简洁方法是什么?我正在尝试禁用平板电脑级别(col-sm)和宽屏幕模式(col-lg)。

想知道最简单的方法是什么。

2 个答案:

答案 0 :(得分:1)

我可以通过三种方式思考问题。

第一个我不喜欢,但无论如何我会说。

破解grid.less或grid.scss(取决于你使用的)并注释掉col-sm和col-lg的部分。这将有效地为您提供您想要的。

第二种解决方案允许您更新您的bootstap版本,而无需担心您的更改被覆盖。但是它也需要更少或更少。

制作你自己的grid.less / grid.scss文件,只包含你想要的媒体,我猜你的目标是媒体。然后使用您自己的文件来执行所有包含并交换原始网格文件包含在您自己的网格文件中的位置。这样你就可以随时下载一个干净的bootstrap副本,只要他们的文件位于同一个位置你就应该得到一个干净的编译。

我想的最简单的方法就是打字时更改其他两个尺码宽度的变量,使它们与你瞄准的尺码相匹配,md,这可能会造成一些可怕的副作用,但它可能只是工作。

答案 1 :(得分:1)

使用col-xs-X类,因为它们是恒定的百分比宽度。

<!-- Don't use .container at all or you will have to
     override a lot of responsive styles. -->
<div class="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>

使用此类代码

.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;
}

有关详细信息,请访问LINK