Html 在img后面背景色上方的容器内添加条纹/线条

附加的图像会将其清除

我创建了一个容器流体并给它一个颜色，然后在容器的中心添加一个PNG图像。现在我想添加一条条纹/线条，另一种颜色在容器背景色之上，但在img PNG之下/之下

请注意，它应该是响应和全宽度的容器

.bg-1{
背景色：#79d4bd；
颜色：#ffffff；
}
.container-fluid1{
填充顶部：10px；
垫底：10px；
}

---

您可以在父对象上使用绝对定位的伪元素和

z-index

来控制重叠。您可以使用

top

和

translateY（）

偏移条纹的位置

.bg-1{
背景色：#79d4bd；
颜色：#ffffff；
}
.container-fluid1{
填充顶部：10px；
垫底：10px；
位置：相对位置；
z指数：1；
}
.container-fluid1:之前，.container-fluid1:之后{
内容：''；
位置：绝对位置；
最高：50%；
左：0；右：0；
转化：translateY（-50%）；
背景：黄色；
高度：2.5em；
}
.container-fluid1：之前{
身高：5公分；
z指数：-1；
转化：translateY（-35%）；
}

---

您可以在父对象上使用绝对定位的伪元素和

z-index

来控制重叠。您可以使用

top

和

translateY（）

偏移条纹的位置

.bg-1{
背景色：#79d4bd；
颜色：#ffffff；
}
.container-fluid1{
填充顶部：10px；
垫底：10px；
位置：相对位置；
z指数：1；
}
.container-fluid1:之前，.container-fluid1:之后{
内容：''；
位置：绝对位置；
最高：50%；
左：0；右：0；
转化：translateY（-50%）；
背景：黄色；
高度：2.5em；
}
.container-fluid1：之前{
身高：5公分；
z指数：-1；
转化：translateY（-35%）；
}

有代码让我们看吗？.bg-1{背景色：#79d4bd；颜色：#ffffff；}.container-fluid1{顶部填充：10px；底部填充：10px；}有代码让我们看吗？.bg-1{背景色：#79d4bd；颜色：#ffffff；}.container-fluid1{padding top:10px；padding bottom:10px；}thaaaankkk YOU Michael！！！工作顺利！：D.非常感谢您的善意和帮助，以及快速回答！thaaaankk YOU Michael！！！工作顺利！：D.非常感谢您的善意和帮助，以及快速回答！