不透明背景上的图像也会增加不透明度

时间:2012-11-09 21:49:54

标签: opacity

我使网站的容器具有不透明度:0.8然后当我在此容器中添加照片时,实际上任何东西,它也显示为相同的不透明度。我想保持100%的图像没有不透明度。我不确定这究竟是如何解决的。我已经尝试过具体改变图像z-index和不透明度但是没有用。任何帮助都会很棒。请参阅下面的示例。

View Sample

2 个答案:

答案 0 :(得分:1)

我认为您最好将这些元素的背景设置为半透明,而不是为整个容器添加透明度。这不会影响照片,也会使文字和按钮更容易阅读。

答案 1 :(得分:1)

请阅读说明,例如在http://css-tricks.com/rgba-browser-support/

  

我们一直有不透明度属性,它类似,但不透明度   强迫所有的后代元素也变得透明有   无法抗拒它

所以你必须使用例如:

background: rgba(200, 54, 54, 0.5);