素材の壺

CSSでボックスを半透明にする〜CSS

CSSでボックスを半透明にする〜CSS

【概要】
CSS3.0から実装される「opacity」を使用した、ボックスの表示を半透明にする方法。


【指定方法】
IE・Firefox・Opera・Netscape・Safariなど特定のブラウザごとに指定します。以下のコードでそれぞれのブラウザで同等の表示がえられます。


.box{
 filter: alpha(opacity=70);
 -moz-opacity:0.7;
 opacity:0.7;
}


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


※「opacity」はCSS3.0から正式に実装されます。最新のブラウザであれば動作はほとんど問題ありませんが、現時点ではValidatorを通すとエラーになります。

コメントする

名前
電子メール
URL
コメント
サイト内検索
TOP利用規約リンクについてお問い合わせ│相互リンク[ 素材1 ][ 素材2 ][ 素材3 ][ HP制作 ]│
無料アフィリエイトツール「アフィーノ」