Html 在图像上叠加颜色后，如何在文本上设置所需颜色？

我已经在背景图像上设置了覆盖颜色，然后文本颜色已经更改。我将文本颜色设置为白色，但叠加后颜色发生变化

代码：

正文{
背景：url（./survey form background.jpeg）无重复中心固定；
-webkit背景尺寸：封面；
-moz背景尺寸：封面；
-o-背景尺寸：封面；
背景尺寸：封面；
}
.集装箱{
文本对齐：居中；
颜色：白色；
字体系列：“Poppins”，无衬线；
}
.容器：：之后{
内容：''；
位置：固定；
排名：0；
左：0；
背景色：rgba（68,28,179,0.753）；
z指数：2；
宽度：100%；
身高：100%；
}

freeCodeCamp调查表
感谢您抽出时间帮助我们改进平台

我找到了解决方案

替换

.container::after {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  background-color: rgba(68, 28, 179, 0.753);
  z-index: 2;
  width: 100%;
  height: 100%;
}

使用以下代码：

body::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    background-color: rgba(68, 28, 179, 0.753);
    z-index: -1;
    width: 100%;
    height: 100%;
}

我找到了解决办法

替换

.container::after {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  background-color: rgba(68, 28, 179, 0.753);
  z-index: 2;
  width: 100%;
  height: 100%;
}

使用以下代码：

body::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    background-color: rgba(68, 28, 179, 0.753);
    z-index: -1;
    width: 100%;
    height: 100%;
}

---

解决这个问题的最佳方法是，首先不要使用伪元素。您可以在背景图像之前使用线性渐变直接为其着色，如下图所示：

body{背景：线性渐变（rgba（68,28,179,0.753），rgba（68,28,179,0.753）），url（./survey form background.jpeg）无重复中心固定；}

正文{
背景：线性梯度（rgba（68,28,179,0.753），rgba（68,28,179,0.753）），url(https://www.tacoshy.de/Images/Yoshi/IMAG0735.jpg)无重复中心固定；
-webkit背景尺寸：封面；
-moz背景尺寸：封面；
-o-背景尺寸：封面；
背景尺寸：封面；
}
.集装箱{
文本对齐：居中；
颜色：白色；
字体系列：“Poppins”，无衬线；
}

freeCodeCamp调查表
感谢您抽出时间帮助我们改进平台

解决这个问题的最佳方法是首先不要使用伪元素。您可以在背景图像之前使用线性渐变直接为其着色，如下图所示：

body{背景：线性渐变（rgba（68,28,179,0.753），rgba（68,28,179,0.753）），url（./survey form background.jpeg）无重复中心固定；}

正文{
背景：线性梯度（rgba（68,28,179,0.753），rgba（68,28,179,0.753）），url(https://www.tacoshy.de/Images/Yoshi/IMAG0735.jpg)无重复中心固定；
-webkit背景尺寸：封面；
-moz背景尺寸：封面；
-o-背景尺寸：封面；
背景尺寸：封面；
}
.集装箱{
文本对齐：居中；
颜色：白色；
字体系列：“Poppins”，无衬线；
}

freeCodeCamp调查表
感谢您抽出时间帮助我们改进平台

问题是：

.container:：在{z-index:2；}之后

它按层放置在文本元素之上。@tacosh是的，您是对的。我知道了，我已经发布了答案。谢谢。问题是：

.container:：在{z-index:2；}

之后，它按层放置在文本元素之上。@tacosh是的，你说得对。我知道了，我已经发布了答案。非常感谢。