html - Bootstrap 3 在容器内添加容器流体？

Question

我有一个普通容器，我想在这个容器内添加一个全宽容器流体，以便容器在我的屏幕上是全视点。我试过了，但它不是全宽。

<div class="container">

<div class="container-fluid">

</div>

</div>

根据我的说法，容器流体是整个容器的全宽，而不是屏幕。有什么方法可以覆盖它吗？

Answer 1

.full-width {
    width: 100vw;
    position: relative;
    margin-left: -50vw;
    left: 50%;
}

<div class="container">
  <div class="container-fluid full-width">
  </div>
</div>

之所以可行，是因为您使用的是 vw - vertical-width，它等于最终用户的桌面宽度。这会覆盖 %，因为 % 是父级的百分比，vh 使用桌面。