Filter系タグの対応比較

元はこの方のパクリです。最近ＩＥ８で表示しない事に気が付いて色々調べてみたら、タグの書き方が変わっていました。ので、更に追記しました。

filter系プロパティは画像に使用することは余り無いのですが、文字に影をつける場合に使用することがあるので、今一度まとめて見ました。

下の５点の写真は同じ画像を用いて、１．はそのまま、２．～５．はそれぞれにスタイルで画像に半透明処理（６０％の不透明度指定）をしています。

２．は｢Internet Explorer7以前、8の互換表示含む｣で半透明になり背景の画像が透けて見えていると思います。filter:Alpha(opacity=数値);で透明度指定しているからです。

３．は｢Firefox（３以前）｣や｢Netscape｣で２．と同等の半透明表示をさせるプロパティー -moz-opacity:数値;で透明度を指定。

４．は｢Firefox(2以前は未確認)｣｢Safari｣で半透明表示させるプロパティー opacity:数値;で透明度を指定。

５．は「Internet Explorer8」以降で半透明表示させるプロパティー-ms-filter:"alpha(opacity=60)";で透明度を指定しています。２．で紹介したタグの記述の仕方が変更されたもので。filterタグの頭に「-ms-」を付け、値を""で囲んでいます。但しこのタグだけでは透過せず、２．のタグも同時に指定しています。関連リンク


６．は２．～５．のプロパティーを同時に指定しています。

ＩＥ９はWindowsXPには対応しないようなので使う事は無いでしょうが、
opacity:数値;(CSS３正規表現)に統一される事を望みます。