使用 CSS 覆盖透明 div 中的不透明文本

我试图使透明 div 内的文本没有不透明度，也就是全黑：

<div style="opacity:0.6;background:#3cc;">
    <p style="background:#000;opacity:1">This text should be all black</p>
</div>

只用 CSS 就可以做到这一点吗？

提前致谢

最简单的方法是使用 opacity/alpha 设置父 div 的背景样式：

div  {
    background: #fff; /* for browsers that don't understand the following rgba rule */
    background-color: rgba(255,255,255,0.5); /* rgb, white, with alpha at 0.5 */
}

但是，这与 IE 不兼容。

对于 IE >= 7 兼容性，您可以使用：

div  {
    background-image: url('path/to/partially_transparent.png');
    background-position: 0 0;
    background-repeat: repeat;
}

我记得 IE

正如 easwee 所指出的，不透明度是由包含的元素继承的，这就是为什么你不能覆盖它，也是为什么我更喜欢使用background-color/background-image方法。