黑色Div与不透明度显示为灰色

Question

我有一个浅背景的Div和里面的div。我想给内部div的背景颜色一个透明的黑色（意味着我应该能够看到父Div的一些浅色背景）。用CSS可以做到吗？

我尝试了这个，但它不起作用，div显示为灰色且不透明。

JsFiddle

<div style="width: 600px height: 600px;background:#fcfcfc;position:relative; ">

    <div style="position:absolute;top:200px:left:200px;height:200px;width:200px;background:rgba(0,0,0,0.6); ">
    </div>
</div>

如果我有一个黑暗的背景，不透明度工作正常。

谢谢！

Answer 1

您可以使用opacity设置Alpha通道。这就是它的完成方式。

<div><div></div></div>

div {
    width: 200px;
    height: 200px;
    background-color: yellow;
    position: relative;
}
div div {
    position: absolute;
    top: 50px;
    left: 50px;
    width: 50px;
    height: 50px;
    background-color: gray;
    opacity: .5;
}

http://jsfiddle.net/GZj75/