CSS"；“爆发”；引导行/列的数目，以使背景成为整个浏览器宽度

我有一个复杂的Bootstrap-4网格布局。现在，突然在一列中，我需要让背景（不是内容！）从浏览器窗口的左侧延伸到浏览器窗口的右侧，整个宽度。有什么办法可以做到这一点吗

<div class="container">
    <div class="row">
        <div class="col">
            <h2 class="font-weight-light">Hello!</h2>
            <p>
                This background should stay white.
            </p>
        </div>
    </div>
    <div class="row mybackground">
        <div class="col">          
            The red background should fill ALL of the browser-width from left to right, but keep the area above and below with white background.
        </div>
    </div>
</div>

你好

这个背景应该保持白色。

红色背景应该从左到右填充浏览器的所有宽度，但上面和下面的区域应保持白色背景。

如果你看小提琴，

的背景应该是从左到右（没有左右的白色填充物），但它的内容应该保持原样

---

你知道如何用最少的更改来完成这项工作吗（因为不幸的是，代码中有很多地方需要这样做，所以一个简单的css类会非常棒）。

现在，你不应该在容器中添加行，而应该有带容器的部分

例如：

你好
这个背景应该保持白色

你好
这个背景应该保持白色

红色背景应该从左到右填充整个浏览器宽度，但上面和下面的区域应保持白色背景

Werner您所说的从左到右的

应该是什么意思

谢谢您的回复。我添加了一张图片以使其更清晰。您不能在元素的维度之外应用背景。如果您不想在这里打破整个网格以使元素本身具有全宽（然后再次限制其内部实际内容的宽度），那么您可能需要使用实际图像（或者至少是一个辅助元素，可以应用背景图像），并将其与此技术相结合：谢谢，该链接非常有助于了解哪些是可能的（哪些不是）。