Css 不透明度小于childs的容器

我想使我的网页具有

背景色

和

不透明度：0.5

，但网页内的内容将具有

不透明度：1

，作为默认值

问题是，如果我将容器设置为

opacity:0.5

，那么该容器中的所有孩子都会获得相同的

opacity

值

我到处找了找，看到了：

继承的否

但就我而言，它是遗传的，所以我搜索了更多，并找到了另一个我看到的：

如果对象是容器元素，则效果就像使用遮罩将容器元素的内容与当前背景混合一样，其中遮罩的每个像素的值为

因此，似乎不可能将父对象的透明度设置为比其子对象的透明度低，是否有一些解决方法

注意：我认为在这种情况下添加代码不是很重要（因为您可以很容易地复制代码），但我创建了一个简单的JSFIDLE来“玩”它

提前谢谢

不，这是不可能的

如果只需要半透明背景而不影响内容，可以使用

RGB颜色模型在本规范中进行了扩展，包括 “alpha”允许指定颜色的不透明度

比如说,

正文{
背景：线性渐变（向右，#fff，#ff0，#0ff）；
}
p{
背景色：rgba（0,0,255,0.3）；/*半透明纯蓝*/
填充：70px；
}

---

半透明背景但完全不透明的文本不可能。父容器的不透明度也将应用于子容器。如果希望背景具有不透明度效果，可以使用RGBA作为背景色。这适用于纯色，还有一个用于处理渐变的选项

如果您有要使用的图像，可以使用div/container将绝对图像放置在内容后面。给那个容器一个不透明度和一个位置