Html div元素不透明度受图像不透明度的影响

我有一个前端项目，其中图像上方有一个

方形项目。我的方块被支持为全红色，但会失去透明度。
这是我的页面中正方形的外观，而不是完全红色：
我的代码：


.html、.body{
背景尺寸：封面；
}
身体{
溢出x：隐藏；
保证金：0；
背景：rgba（0,0,0,0.1）；
}
.欢迎集装箱{
位置：相对位置；
顶部：0px；
左：0px；
宽度：100%；
高度：550px；
边际：0px；
背景位置：中心；
背景重复：无重复；
背景尺寸：封面；
}
.欢迎光临{
位置：相对位置；
}
欢迎光临{
背景：线性梯度（rgba（0,0,0,0.5），rgba（0,0,0,0.5）），url（'file:///Volumes/Animus/Jon/Dropbox/website/hellcity.jpg');
}
.ds广场{
背景色：红色；
高度：50px；
宽度：50px；
位置：绝对位置；
顶部：2个；
左：2%；
不透明度：1；
}
欢迎光临{
宽度：100%；
高度：550px；
不透明度：0.8；
}
.照片内{
位置：绝对位置；
最高：30%；
左：50%；
字体大小：60px；
转换：翻译（-50%，-50%）；
}
.图h3内{
字号：18px；
}

//我的广场
乘坐DS
航空公司的航班
从雅典飞往雅典的航班！与我们一起安全舒适地飞行！

.html、.body{
背景尺寸：封面；
}
身体{
溢出x：隐藏；
保证金：0；
背景：rgba（0,0,0,0.1）；
}
.欢迎集装箱{
位置：相对位置；
顶部：0px；
左：0px；
宽度：100%；
高度：550px；
边际：0px；
背景位置：中心；
背景重复：无重复；
背景尺寸：封面；
}
.欢迎光临{
位置：相对位置；
}
欢迎光临{
背景：线性梯度（rgba（0,0,0,0.5），rgba（0,0,0,0.5）），url（'file:///Volumes/Animus/Jon/Dropbox/website/hellcity.jpg');
}
.ds广场{
背景色：rgba（255,0,0,0.4）；
高度：50px；
宽度：50px；
位置：绝对位置；
顶部：2个；
左：2%；
不透明度：1；
}
欢迎光临{
宽度：100%；
高度：550px；
不透明度：0.8；
}
.照片内{
位置：绝对位置；
最高：30%；
左：50%；
字体大小：60px；
转换：翻译（-50%，-50%）；
}
.图h3内{
字号：18px；
}

//我的广场
乘坐DS
航空公司的航班
从雅典飞往雅典的航班！与我们一起安全舒适地飞行！
您的代码片段似乎不起作用。子级不透明度不能推翻父级不透明度。即使正方形具有
不透明度：1
，如果其任何父对象的不透明度小于1，则它将显示为半透明。@Gershom没有任何方法可以更改此设置吗？您需要确保正方形及其所有父对象的不透明度为
1
您还需要确保正方形没有被半透明元素覆盖-这将导致正方形显示为半透明，实际上，coveredIt并没有帮助。还是谢谢你