twitter-bootstrap-3 - Bootstrap 3 - 将桌面的容器宽度设置为最大 940 像素？

Question

我正在使用 Twitter Bootstrap 3 向网站添加一个全新的部分，但是对于桌面，容器的总宽度不能超过 940 像素 - 因为它会丢弃页眉和页脚 {includes}。

所以 940 像素的列是 12 x 60 = 720 像素，排水沟是 11 x 20 = 220 像素。很公平，但是由于“自定义”部分中没有“@ColumnWidth”字段/设置，您如何将这些输入到 Bootstrap 3 中？

我尝试将@container-lg-desktop 和@container-desktop 都设置为940px - 但它不起作用。

Answer 1

Bootstrap 3 中有一个更简单的解决方案 (IMO)，不需要您编译任何自定义 LESS。您只需要利用“级联样式表”中的级联。

像这样设置你的CSS加载......

<link type="text/css" rel="stylesheet" href="/css/bootstrap.css" />
<link type="text/css" rel="stylesheet" href="/css/custom.css" />

在哪里 /css/custom.css是您独特的风格定义。在该文件中，添加以下定义...

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

这将覆盖 Bootstrap 的默认值 width: 1170px当视口(viewport)为 1200 像素或更大时设置。

在 Bootstrap 3.0.2 中测试