解析 IE、FireFox、Opera ブラウザはアルファ透過メソッドをサポートします

この章では、IE、FireFox、Opera ブラウザーがどのように Alpha 透過性をサポートしているかを分析します。必要な方は参考にしていただければ幸いです。

最初に次のコードを見てください:

コードは次のとおりです:

filter:alpha(opacity=50);       /* IE */  
-moz-opacity:0.5;              /* Moz + FF */  
opacity: 0.5;           /* 支持CSS3的浏览器（FF 1.5也支持）*/

簡単に説明すると、IE はprivate 属性 filter:alpha( opacity)、Moz Family はプライベート属性 -moz-opacity を使用し、標準属性は opacity (CSS 3、Moz Family は CSS3 を部分的にサポートします) です。次の値は透明度です。パーセンテージまたは 10 進数 (アルファ (不透明度)) を使用します。実際にはパーセンテージです。0 より大きく 100 未満の値を使用します。

上記のコードからは Opera は見えません。そうです、Opera はまだ標準の不透明度をサポートしておらず、アルファ透明度をサポートする独自のプライベート プロパティも持っていません。

しかし、Opera がアルファ透明 PNG 画像をサポートしていることはわかっています (もちろん Moz Family もサポートしています)。したがって、背景画像を使用してアルファ透明度を実現できます。

例: http://realazy.org/lab/alpha/

キーは次のとおりです:

コードは次のとおりです:

background: transparent url(alpha80.png) left top repeat!important;  
background: #ccc;  
filter:alpha(opacity=50);

Moz Family はアルファ透過 PNG をサポートしているため、そのプライベート プロパティを使用する必要はありません。もちろん、標準の不透明度を使用することもできますが、アルファ透明イメージと不透明度を同時に使用しないでください。そうしないと、2 つが混合したものになります。上記の例をダウンロードして、/*opacity: .5;*/ のコメントを確認してください。