初心者のWEBデザイン

HTML,CSS、その他WEBデザインに関する事を記述していきます

20150411143621

CSS 透過の調整とIE対応についての注意

CSSで透過の調整をするときのお話です。

CSS3での透明化

セレクター {
opacity:0.7;
}

これだけで最新のブラウザでは不透明度を調整できるはずです。



昔のIEで透過の調整する場合にはopacityは効きませんので
下記の記述が必要になります。

注意点:hoverなどで指定する場合には指定する要素に
display:inlineがかかっている場合には機能しません。


IEでの透明化

セレクター {
filter: alpha(opacity=70);        /* ie 6 7 */
-ms-filter: "alpha(opacity=70)";  /* ie 8 */
}


クロスブラウザでの透明化

セレクター{
filter: alpha(opacity=70);        /* ie 6 7 */
-ms-filter: "alpha(opacity=70)";  /* ie 8 */
opacity:0.7;
-moz-opacity:0.7;
-webkit-opacity:0.7;
}
topへ戻る