html - 覆盖图像的背景不透明度

Question

我想改变图像的不透明度。现在它只是继承了它母亲的不透明度设置，但我想让它不那么透明。简而言之:在 http://quaaoutlodge.com右侧是“Jack Sam's Restaurant & Lounge”图片。我想让它的透明度低于背景。如果我改变 .rteright 的不透明度设置，我似乎只能让它更透明但不能更少......我怎样才能达到我想要的？请指教!代码:其中“pageBorder”是 sert tio opacity 0.7

<div id="pageBorder" class="noborder">
<p class="rteright" style=""><a href="http://quaaoutlodge.com/content/jack-sams-restaurant-and-lounge"><img alt="Jack Sam's Restaurant and Lounge" src="http://quaaoutlodge.com/sites/default/files/jack-sams-lounge--3-_0.jpg" style="text-align: right; width: 200px; height: 133px; float: right; border:1px #000 solid;" /><em>Jack Sam's Restaurant &amp; Lounge</em></a></p>
</div>

谢谢，罗恩

Answer 1

使用 rgba() 值使元素的背景仅透明。 opacity 使所有子元素透明，而不仅仅是父元素。

类似于:

background: rgba(128,102,51,0.5);

取值如下:

background: rgba(red, green, blue, opacity);