css - Susy 网格中部分的全尺寸背景

Question

我想在Susy 网格系统中创建类似的东西：

不同的颜色表示网站的不同部分以及它们的背景颜色。垂直线是网格列。

如果我使用简单的网格容器，我只能在网格内的 div 内设置背景颜色，但我希望将背景颜色拉伸到网站的左右边缘。内容保留在网格内。

我找到了一个使用多个网格容器（每个部分一个）的解决方案，但我听说不推荐这种方法。

而且我也不想使用流体网格容器。

Answer 1

正如 Susy 的开发者 Eric Meyer 在评论中指出的那样，Susy 网格只是一个概念，网站上有多个网格并没有错，每个部分都有一个。

Answer 2

我正在处理一个类似的问题。我使用了以下方法：div在每个部分中都有一个（我们称之为“内容”）。

将容器类应用到“内容”div。.content{@include container;} 这样，当您设置部分的背景颜色时，它会跨越页面的整个宽度，而部分中的内容符合网格规则。

希望这是有道理的。