你可以让 css 不透明度堆叠（尤其是在 IE 中）吗？答案

【问题标题】：Can you get css opacity to stack (especially in IE)?你可以让 css 不透明度堆叠（尤其是在 IE 中）吗？
【发布时间】：2013-07-11 02:48:29
【问题描述】：

假设我有 3 个 div，一个放在另一个之上。

但是，鉴于以下示例和 css，似乎外部 div 的透明度始终优先于内部 div。我在 jsFiddle 中对此进行了测试，整个事情只有 50% 是白色的。有没有办法让透明度堆叠？所以在这个例子中，我的内部正方形的不透明度约为 80%？

<div class="o1">
    <div class="o2">
        <div class="o3">
            blah
        </div>
        blah
    </div>
    blah
</div>

body {
    background-color: black;
}

.o1 {
    background-color: rgb(255,255,255);
    filter:alpha(opacity=50);
    opacity: 0.5;
    width: 200px;
    height: 200px;
}

.o2 {
    background-color: rgb(255,255,255);
    filter:alpha(opacity=50);
    opacity: 0.5;
    width: 150px;
    height: 150px;
}

.o3 {
    background-color: rgb(255,255,255);
    filter:alpha(opacity=50);
    opacity: 0.5;
    width: 50px;
    height: 50px;
}

【问题讨论】：

标签： html css filter opacity alpha

【解决方案1】：

不是作为孩子，而是作为独立的DIV 绝对相互重叠：

http://jsfiddle.net/6Wnhy/

【讨论】：

【解决方案2】：

我认为你需要使用

rgba(255,255,255,0.5);

改为。

这是你需要的吗？ Jsfiddle

【讨论】：

不（是的，这就是我需要的，但是...），我不能使用 rgba，我之前已经有一些可以使用 rgba 的东西，但不得不更改它们，因为我需要愚蠢的 IE8 才能工作，我也需要它在“兼容模式”下工作。
因为我没有任何方法来测试它，我帮不了你很多，但似乎this 家伙找到了一种方法来解决它只用 IE 的 css。