月別アーカイブ: 2013年10月

css3で背景を透過する時の注意

css3で背景を透過する時の注意

白背景の透過を使いたいなーって思ったときに、いつもは透過png画像を使っていました。

ふと、css3で良いかなって思ってやってみたらいい感じだったのでそれはOKなのですが、
途中で調べて気になった記事を見つけたのでメモ

背景色をrgbaとrgbで2重指定するときのIE地雷

ie7,8は、rgbaが使えないので、rgbを念のためつけておきますが、

A:

background: rgb(255, 255, 255);
background: rgba(255, 255, 255, 0.5);

B:

background-color: rgb(255, 255, 255);
 background-color: rgba(255, 255, 255, 0.5);

Bの場合はIE6-8で背景色が設定されていない状態になるそうです。
試していないですが、はまりそうですね・・・

もう一つの透過opacityは、背景だけでなく子要素まで透過してしまいます。
opacity: 0.6;
背景だけのときはrgbaですね。
rgba(0,0,0,0.6);