4

不透明度0.8のコンテンツボックスにYouTube iframeを配置しています

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

ただし、ビデオは透過的に表示され、サイトの背景が透けて見えます。可能な限り wmode を変更しようとしましたが、違いはありません。これは Firefox では発生しませんが、Chrome では発生します。

4

3 に答える 3

3

要素でCSS プロパティを使用するopacityと、そのすべての子がそれを継承し、変更する必要はありません...

...ただし、透明な png 背景画像を使用するか、rgba()またはhsla()色の値を使用できます。

透明な黒いrgbaはhslaになりbackground: rgba(0, 0, 0, .5);ますbackground-color: hsla(0, 0%, 0%, .5);

これらのプロパティは継承されないため、それらが何であれ、子には影響しません:)

ここでは、3 つの異なる CSS ルール (透明な png ではない) が使用されていることがわかります。最後の 2 つの子要素は影響を受けないことに注意してください :)

http://jsfiddle.net/SJK2H/

于 2012-12-01T14:58:43.693 に答える
2

実際、それが機能するopacityはずの方法です。背景だけでなく、要素とそのすべてのコンテンツに不透明度を設定します。半透明の背景だけが必要な場合は、透明な png のようなものをbackground-image.

于 2012-12-01T14:50:00.237 に答える
1

不透明度の代わりに半透明の .png を背景として使用することをお勧めします。背景色として rgba を使用することもできますが、IE には実装されていません。Rgba は IE 8 以下ではサポートされていないため (IE 9 については不明)、代わりにフィルターを使用して目的の効果を得ることができます。しかし、フォントの見栄えが悪くなってしまうことがあります (アンチエイリアスやその類の処理が削除されます)。

一方、1*1px の png は非常に小さく、css ファイルに組み込むことができます。

于 2012-12-01T15:19:53.070 に答える