html - 如何使 css opacity 属性不从父 div 继承？

Question

我想要在 png 图像后面有一个黑条，并且我希望图像后面的黑条具有不透明度。当我对黑条应用不透明度时，他的子元素(png 图像)继承了这种不透明度。我不希望发生这种情况。

网站是 www.tomasfleiderman.com.ar ，上面写着“为钱工作，为爱设计”我想要一个不透明的黑条。

代码如下:

<style type="text/css">
p {
font-size:40px;
color: white;
}
#caja
{

}
#fondofrase
{
}
</style>
<!--
<p>Work for money design for love</p>
  -->
<div  id="fondofrase">
<div  id="caja">
<div>
<img src="http://www.tomasfleiderman.com.ar/1.png" alt="Texto" height="60%" width="60%"/>
</div>
</div>
</div>

谢谢

Answer 1

您可以使用半透明背景色来做到这一点:http://jsfiddle.net/alessandro_pezzato/LWh75/

 background: rgba(0,0,0,0.8);