为什么我的HTML元素继承了父元素的不透明度

Question

所以我在我的HTML文档中放置了一个图像标记，它似乎从父div元素继承了不透明度。我已经尝试了很多方法来改变它，但它不会起作用。 一个例子：

<div style="opacity: 0.7">
<img src="http://parteetime.com/pics/wallpaper/majestic-1280-1024.jpg"/> 
</div>

任何帮助都会很棒。

Answer 1

opacity使整个元素不透明。

使用rgba作为背景颜色以防止整个元素变得不透明。

这只会产生半透明的背景。

尝试：

div{background-color:rgba(0,0,0,0.7);} //rgba -- red,green,blue,alpha

See fiddle for the difference,