Bootstrap：v3.3.7 需要帮助来理解全宽背景颜色问题

Question

首先你好。

我在较大的设备上使用带有全宽标题背景颜色的 Bootstrap 没有问题，容器流体为我解决了这个问题，但是我想要实现的是在将屏幕尺寸缩小到更小的屏幕尺寸（即

例如：

<div class="container-fluid">
  <div class="row">
     <div class="col-md-12 col-xs-12">
     </div>
  </div>
</div>

为所有屏幕尺寸提供全宽标题。

然而：

<div class="container">
   <div class="row">
      <div class="col-md-12 col-xs-12">
      </div>
    </div>
</div>

在较大的视口上提供一个居中的标题，两边都有边距（这只是我想要的小屏幕），但是当我向下调整视口的大小时，标题变成了视口的全宽。

解决这个问题的正确方法是什么？.. 我可以将一个容器放在另一个容器中，并通过使用 css 和媒体查询来更改主容器的背景颜色（即：白色），以便我的内部容器（背景颜色黑色）然后将是左右边距/装订线。也许这是对这个问题的过度设计，甚至不是语义问题，有人可以给我更多的见解，

非常感谢

Answer 1

包装一个 div 你的container 喜欢

<div class="header">
<div class="container-fluid">
  <div class="row">
     <div class="col-md-12 col-xs-12">
     </div>
  </div>
</div>
</div>

然后在header 类上应用样式