Bootstrap 3中的全宽hr元素

Question

我是bootstrap的新手，我想知道如何为一个元素提供一个完整的屏幕宽度？例如，我有一个<hr>元素，我希望它的宽度可以全屏显示。

我注意到row正在使用-15px margin-left和margin-right，我们如何在不影响网站其他行的情况下删除该边距？

Jsfiddle：http://jsfiddle.net/shadeed9/pwvg6o7n/（查看全屏以获得更好的视图）

HTML：

<div class="row">
        <div class="content">
            <div class="container">
                <h1>Welcome to my website!</h1>
            </div>
            <div class="container-fluid">
                <hr>
            </div>
        </div>
</div>

谢谢！

Answer 1

您只需将其从容器中取出即可。

<div class="container">
  <div class="row">
    <!-- STUFF -->
  </div>
</div>
<hr> <!----- here -->
<div class="container">
  <div class="row">
    <!-- STUFF -->
  </div>
</div>