父元素为透明的HTML元素不会变得不透明

Question

有没有办法制作父透明不透明的元素？例如，在这个jsFiddle上，我有一个单词“blah”，其中父div是透明的。我怎么会变得“不透明”？

我的HTML：

<div><p class="blah">blah</p></div>

我的css：

div{
    height:100px;
    width:100px;
    margin:auto;
    background-color:white;
    opacity:0.5;
}
.blah{
    opacity:1;
}
body{
    background-color:blue;    
} 

Answer 1

儿童不能比他们的父母具有更高的不透明度，因为他们的不透明度会增加。

你可以使用png背景或rgba颜色： http://css-tricks.com/rgba-browser-support/

div {
  background-color: rgba(255,255,255,0.5);
}

Answer 2

不透明度不适用于“元素”，它适用于“元素及其所有内容”。您可以使内容比其父内容更透明，但不能更透明。