Question

我有Bootstrap网站使用.container为我的网站CSS中的CSS添加.container属性进行布局：

.container {
    width: 1170px;
}

我现在正试图转移到.container-fluid布局，以便我可以在我的div中使用全屏幕背景图像，但同时我仍然需要我的div的实际内容才能拥有.container - 就像布局一样。到目前为止，我试图在.container中嵌套.container-fluid，但这似乎不是最佳解决方案或良好做法。

非常感谢任何指导。

Answer 1

<div class="container-fluid">
   <div class="wrap">
    <div class="container">
      <div class="row">
        here u can use span or u can provide the style property
      </div>
    </div>
  </div>
</div>

认为它应该有助于你：）

Answer 2

我最近想要这样做，但我发现的一些解决方案比需要的更复杂。我所做的几乎就是uʍopǝpısdn已经在你的问题的评论中提出的建议，即在.container中包裹div。

我为每个需要着色的部分创建了一些颜色样式：

.bg-black {
    background-color: #111;
}
//add more colors, even background images in a similar manner

并将这些样式用作每个包装的类div：

<div class="bg-black">
    <div class="container">
        //content here
    </div>
</div>
<div class="bg-red">
    <div class="container">
        //other content here
    </div>
</div>
//...and so on

此解决方案显然要求您重新构建HTML，每个部分使用一个.container，而不是.container每个body，我发现这些效果非常好。< / p>

具有“.container-like”布局的Bootstrap .container-fluid

2 个答案: