YouTube視頻TRANSPARANT以及

Question

我把一個YouTube的iframe中有0.8不透明內容框

opacity: .8; 
filter: alpha(opacity=80); 

但影片呈現TRANSPARANT以及，如你可以看到通過他們的網站的背景。我試過儘可能地改變wmode，但它沒有區別。這並不與Firefox發生，但它在Chrome

做我新的這一切很抱歉，如果這是愚蠢的！在詢問之前，我做了大量的搜索，但沒有運氣。

Answer 1

當您使用CSS屬性opacity一個元素，它的所有的孩子將繼承它，有你做些什麼來改變它什麼...

...除非你可以使用一個透明的PNG背景圖像，或者使用rgba()或hsla()顏色值。

所以透明的黑色RGBA將background: rgba(0, 0, 0, .5);和HSLA background-color: hsla(0, 0%, 0%, .5);

這些屬性是不能繼承的，因此不會影響到孩子，無論他們是:)

在這裏，您可以看到三個不同的CSS規則（不透明PNG）在使用中。需要注意的是最後兩個子元素不受影響:)

http://jsfiddle.net/SJK2H/

Answer 2

其實，這是怎麼opacity應該工作，它設置元素的透明度和它的所有內容，而不僅僅是背景。如果你只是想要一個半透明的背景下，你應該使用像一個透明的PNG作爲background-image。

Answer 3

我建議使用半透明巴紐作爲背景，而不是不透明度。 您還可以使用RGBA作爲背景顏色，但它不是在IE瀏覽器中實現。在IE 8及以下版本中不支持Rgba（不確定是否適用於IE 9），所以使用過濾器可以實現所需的效果。 但有時莫名其妙地讓字體看起來可怕的（消除抗混疊濾波器或不便。那種）。

另一方面，1 * 1px的png非常小，可以內置到您的css文件中。