6

如何在 Bootstrap 中选择960px宽而不是 1200px 的容器？

4

5 回答 5

9

Bootstrap 在屏幕宽度超过 1200 像素时将容器宽度设置为 1170 像素。
对于从 992 像素到 1200 像素的屏幕，容器的宽度设置为 970 像素。您可以在此处阅读有关引导程序网格的更多信息
现在，如果要将容器设置为 760px 以用于大屏幕，则必须找到它并在 bootstrap.css 中进行编辑或将此代码添加到您的自定义 css 中：

@media (min-width: 1200px) {
  .container {
    width: 960px;
   }
}

和

@media (min-width: 992px) {
  .container {
    width: 960px;
   }
 }

希望这可以帮助

于 2013-11-21T22:31:25.603 回答
5

你只想要一个固定宽度的网站吗？如果是这样，那么就不要包括bootstrap-responsive.css. 固定宽度容器的默认宽度为 960 像素。

否则，如果您仍然想要响应式功能但没有 1200px 容器，则需要自定义引导安装。要做到这一点：

于 2012-12-20T20:14:28.137 回答
1

这对我有用。

!important 不推荐使用。但你可以试试。

.container, .container-流体{
 宽度：960 像素！重要；
}
于 2012-12-21T05:24:48.567 回答
0

对于 Bootstrap3，您可以自定义它以默认获取 960px ( http://getbootstrap.com/customize/ )

  1. 将@container-lg 从 ((1140px + @grid-gutter-width)) 更改为 ((940px + @grid-gutter-width))。
  2. 将@grid-gutter-width 从 30px 更改为 20px。

然后下载您的自定义版本的引导程序并使用它。现在默认应该是 960px。

于 2014-01-14T06:37:49.680 回答
0

如果您使用的是 sass 和 bootstrap v3.3.1，只需在导入 bootstrap之前定义这些变量：

$grid-gutter-width: 20px;
$container-large-desktop: 940px + $grid-gutter-width;

有关更多信息，请查看变量源文件： https ://github.com/twbs/bootstrap-sass/blob/master/assets/stylesheets/bootstrap/_variables.scss

于 2015-01-15T10:37:37.750 回答