weblovelog

ウェブ業界人のためのウェブ情報サイト。

IE対策もバッチリ。画像や文字をCSSで半透明にする方法

      2014/06/27

opacity:0.5;
filter: alpha(opacity=50); /* ie lt 8 */
-ms-filter: "alpha(opacity=50)"; /* ie 8 */
-moz-opacity:0.5; /* FF lt 1.5, Netscape */
-khtml-opacity: 0.5; /* Safari 1.x */
zoom:1;

 

私はcssで半透明というワザを覚えた当初、苦い経験をしました。

当時(6年前?7年前?)の私は、画像を使わずCSSのみで角丸や円、ドロップシャドウや半透明を表現できることに感動を覚えていました。
そこで、画像を使わずCSSのみでサイトを作ってやろうと思い立ちました。

結果は…

 

IEで表示がボロボロ。。。

実は私、最後までIEで確認しなかったんですねー。(お馬鹿さんですね−。)

結構時間がかかっただけに
結構力を入れただけに

とっても落ち込みました。

 

それからというもの、そういうたぐいのものを使うのを避け続けていたのですが、
さすがに数年前からIE対策をしつつ使い始めました。

 

ただ、いつも忘れてしまって同じものを何回も何回もググっているので、
忘れたときに確認できるよう、(記事の一番上に)サンプルをメモメモ。えらいーー

 - CSS, WEB , ,

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

  関連記事