CSS opacity 属性

定義と使用方法

opacity 属性は、要素の不透明度レベルを設定します。

参照：

CSS チュートリアル：CSS 图像透明度

CSS チュートリアル：CSS 頂点

HTML DOM リファレンスマニュアル：opacity 属性

例

div 要素の不透明度レベルを設定します：

div
{
opacity:0.5;
}

自分で試してみる

このページの下部にさらに多くの例が見つかります。

CSS 文法

opacity: value|inherit;

属性値

値 説明 テスト
value 不透明度を指定します。0.0（完全に透明）から1.0（完全不透明）までです。 テスト
inherit 親要素から opacity 属性の値を継承するべきです。

技術的詳細

デフォルト値： 1
継承性： no
バージョン： CSS3
JavaScript 文法： object.style.opacity=0.5

さらに多くの例

要素の不透明度を変更する
この例では、JavaScriptを使用して要素の不透明度を変更する方法を示します。

ブラウザのサポート

テーブルの数字は、その属性を完全にサポートする最初のブラウザのバージョンを示しています。

Chrome IE / Edge Firefox Safari Opera
4.0 9.0 2.0 3.1 9.0

注釈：IE8 以前のバージョンでは、代替の filter 属性がサポートされています。例えば：filter:Alpha(opacity=50);