html - 使用 Bootstrap 设置 body 的最大宽度

Question

我正在使用 Twitter Bootstrap 构建我的第一个网站并尝试使用流畅的布局。我已将我的容器设置为流动的，现在里面的内容占据了整个页面宽度并随着我调整浏览器大小时进行调整。

我正在设计的最大宽度约为 950 像素。

我检查了 variables.less 和 responsive.less，以及 Bootstrap 文档；我不太清楚如何做到这一点。

我还尝试将以下内容添加到我的 style.css:

body {
    max-width: 950px;
}

Answer 1

您不必通过删除 @media (max-width:1200px) 来修改 bootstrap-responsive ...

我的应用程序的 max-width 为 1600 像素。以下是它对我的作用:

1. 创建 bootstrap-custom.css - 我尽可能不想覆盖我原来的 bootstrap css。

2. 在 bootstrap-custom.css 中，通过包含以下代码覆盖容器流体:

像这样:

/* set a max-width for horizontal fluid layout and make it centered */
.container-fluid {
  margin-right: auto;
  margin-left: auto;
  max-width: 1600px; /* or 950px */
}