opacityは、IE非対応なので、利用する場合は、IE用の記述が必要です。
対応するブラウザが、
IE7,8,9 chrome,firefoxは最新 という場合にはこれを利用します。
大抵の案件がこの指定でいけるかと思います。
1 2 3 4 5 6 7 8 |
.hoge{ -moz-opacity: 0.8; opacity: 0.8; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80); /* For IE 5-7 */ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; /* For IE 8 */ } |
0.8の部分で、透過具合を設定しています。
透過なしが1、完全に透過が0になります。
filterでは100が透過なし。0が完全に透過です。
画像をhoverした時に少し透過にするとかでは、0.8くらいがちょうど良さそうかなと思います。
1 2 3 4 5 6 7 8 |
.hoge:hover{ -moz-opacity: 0.8; opacity: 0.8; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80); /* For IE 5-7 */ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; /* For IE 8 */ } |
opacityのクロスブラウザ対応用cssでした。