Css 当使用网格时，如何获得背景图像以扩展整个宽度？_Css_Grid_Sass_Background Image

Css 当使用网格时，如何获得背景图像以扩展整个宽度？

css grid sass

Css 当使用网格时，如何获得背景图像以扩展整个宽度？,css,grid,sass,background-image,Css,Grid,Sass,Background Image,有可能让包装器元素的背景图像延伸到网格之外，同时保持响应性吗我可以用方块阴影技术用纯色来做，但是我还不能让背景图像脱离网格我使用的是一个12列的、灵活的、基于百分比的网格，最大宽度为1140px，并浮动列。设置包装元素的背景图像最终会达到1140px，除非我给元素一个绝对宽度（比如150%），这会破坏响应性，而且我很确定这是一个糟糕的做法我的布局很简单，就像这样 <body> <container> <header></he

有可能让包装器元素的背景图像延伸到网格之外，同时保持响应性吗

我可以用方块阴影技术用纯色来做，但是我还不能让背景图像脱离网格

我使用的是一个12列的、灵活的、基于百分比的网格，最大宽度为1140px，并浮动列。设置包装元素的背景图像最终会达到1140px，除非我给元素一个绝对宽度（比如150%），这会破坏响应性，而且我很确定这是一个糟糕的做法

我的布局很简单，就像这样

<body>
    <container>
        <header></header>
        <inner-content>
            <grid-element-one></div>
            <bg-wrap>
                <grid-element-two></div>
            </div>
            <grid-element-three></div>
        </inner-content>
        <footer></footer>
    </container>
</body>

这是你想要的吗

如果是，您必须将

div class=“internal content”

的末尾移到末尾，并修改

.internal content

的css，就像在小提琴中一样

希望这有帮助

干杯

我在想一个伪元素，比如：before可能会这么做，但我使用它们的经验有限，不知道怎么写。你可以制作一把小提琴来看看你到底想要什么吗？@ajc-这里有一把小提琴，不完全是。我只希望背景应用于一个div。像这样，但如果它是蓝色的，我希望能够使用bg图像：而且，因为所有内容都在同一个网格上，我不能只移动内部内容div而不使其他内容倾斜。好的，这一个足够满足您的需要吗？你可能没有考虑过百分比或大小，但我认为这与你预期的结果非常接近。。

.inner-content {
    max-width: 1140px; /* when 768px+, otherwise 96% */
}
.element-two {
    color: $font-color;
    background-color: $bg-gray;
    box-shadow: -25rem 0 0 $bg-gray, 25rem 0 0 $bg-gray;
    height: 475px;
}
.bg-wrap {
    background: url(../images/bg/texture.png) 0 80px repeat;            
}