CSSはdivバックグラウンドの透明度と互換性をどのように設定するか

1611 ワード

CSSはどのようにdiv背景の透明度と互換性を設定するか:できるだけ手書きコードを書くことを提案して、効果的に学習効率と深さを高めることができます.オブジェクトの透明度を設定するのは多くのWebページの特効の中で実用的で、オブジェクトの透明度を設定するのは難しくありません.唯一の難点は、各主流ブラウザとどのように互換性があるかです.以下では、この効果を実現する方法について簡単に説明します.コードの例は次のとおりです.

<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>    </title> 
<style type="text/css"> 
*{ 
  margin:0px; 
  padding:0px; 
} 
.opacity{ 
  width:150px; 
  height:150px; 
  background-color:green; 
  filter:alpha(opacity=50); 
  -moz-opacity:0.5; 
  opacity:0.5; 
  margin-left:20px; 
  margin-top:20px; 
} 
span{ 
  display:block; 
  width:80px; 
  height:80px; 
} 
</style> 
</head> 
<body> 
  <div class="opacity">  
    <span>    </span>  
  </div> 
</body> 
</html>

上記のコードは各ブラウザの互換性を実現しています.透過性のあるコードは次のとおりです.

filter:alpha(opacity=50); 
-moz-opacity:0.5; 
opacity:0.5;

最初の行のコードはIEブラウザでのみ有効です.
2行目のコードは古いバージョンのFFブラウザをサポートしていますが、実際には削除してもいいです.古いバージョンのブラウザの使用率が少ないからです.3行目は各ブラウザをサポートできるが、IE 6-IE 8ブラウザはサポートしていない.特に、背景の透明性は実現されていますが、divの文字も透明な状態に表示されます.これは望ましくないことが多いので、divの透明性を設定する方法を参照してくださいが、文字が不透明な章でこの問題を解決します.
原文の住所は次のとおりです.http://www.softwhy.com/forum.php?mod=viewthread&tid=4680
詳細については、次の項目を参照してください.http://www.softwhy.com/divcss/

jQuery共通フィルタセレクタ

fckeditor使用とエラー処理