• RSS

[CSS]CSSで画像を透過させる際は、IE6用に filter: も併用する

  • このエントリーをはてなブックマークに追加
  • follow us in feedly

リンク画像をロールオーバーさせる時など、要素を半透明にする場合はCSS の opacity プロパティを利用すれば動きます。

CSS3 からは opacity 1つで、モダンブラウザはほぼ動くようになったみたいですが、

IE6で動かない。。。

もうお決まりですね!!!

その場合は opacity と合わせて filter プロパティも同時に利用することで、IE6 でも透過が効くようにしてあげます。

CSS で画像をロールオーバーする際の透過指定

だいたいこんな感じです。



filter: を利用してIE6 対応

IE6 でも動くように filter も合わせて使います。

ついでに、Firefox やNetscape 用の -moz-opacity も使いました。

これでほぼどのブラウザでも見えるようになります。


ただし「透過画像」が絡んでくると、これがまたIE下位バージョン では正常に動いてくれません > <;



  • このエントリーをはてなブックマークに追加
  • follow us in feedly

コメント

コメントを残す

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください