CSS設定でオブジェクトを半透明にできるプロパティがあります。
IEのみのCSSプロパティでしたが、Firefox・Operaでも同じように表示可能にできる方法を説明したサイトがありましたので紹介しておきます。
他にもいくつかのOpacityプロパティを使ったTipsが紹介されていますので、参考に覗いてみてください。

[ PR ]

お知らせ!オンライン上でCSSが設定できるカラー設定ページを作成しました。CSS3ジェネレーターです。box-shadow, text-shadow, opacityの設定もできます。お試しください。More bootstrap: Color Set Archive

CSS Opacity in Mozilla,IE, and Opera

http://www.mandarindesign.com/opacity.html

CSS Opacity設定

以下のコードでIE・Firefox・Opera・Netscape・Safariで同等表示がえられます。

  filter: alpha(opacity=25);
  -moz-opacity:0.25;
  opacity:0.25;
IE
alpha(opacity=透明度);
100が100%となる。25%の場合は、25
Firefox・Netscape
-moz-opacity:.透明度;
1.0が100%となる。25%の場合は、.25
Opera・Safari
opacity:透明度;
1.0が100%となる。25%の場合は、.25

CSS3.0からは、opacity:透明度;の設定ですべてのブラウザで表示可能となるようです。

CSS Opacity サンプルページを作成しました。
こちらに実際にどのように適用されるか、ライブで確かめることができるページを用意しました。お試しください。
IE 対応 クロスブラウザ CSS Opacity sample - sample

参考サイト

半透明のグラデーションをかける-タグインデックス
http://www.tagindex.com/stylesheet/filter/alpha.html

[ PR ]

[ PR ]

[ PR ]

トラックバック(5)

前回のおさらい: #TB_overlay { position: absolut... 続きを読む

制作をしていればみんな一度は見ていると思う「ikesai.com」。 このサイトでサムネールをマウスオーバーすると画像がロールオーバーするんですが、何気な... 続きを読む

hover用のボタンいらず ■IE・Firefox・Opera・Netscape... 続きを読む

a.popup1{position:relative;} a.popup1 span{ position:absolute; top:-20px; ... 続きを読む

ネットを徘徊してて、みつけたよさげなページを置いていきます。 読み物 web制作屋は、一体どのスキルを持っていれば即戦力なのか?17の作業に分解 ▲... 続きを読む