0

不透明度を設定したい div があります。私は次のCSSを持っています:

background: rgb(255, 255, 255); /* Fall-back for browsers that don't support rgba */
background: rgba(255, 255, 255, .7);
filter: alpha(opacity=70); /* IE 7 and Earlier */
/* Next 2 lines IE8 */
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);

対応ブラウザでは正常に動作しますが、IE 8 では div を持つ子要素も透明になります。

この質問はこれと密接に関連していることは承知していますが、そこにある答えはうまくいきませんでした。

誰か提案はありますか？

ありがとう！

4

1 に答える 1

1

IE8はRGBaをサポートしておらず、MSフィルターの不透明度は要素とその子に影響します。

http://css-tricks.com/rgba-browser-support/から提案された修正

<!--[if IE]>

   <style type="text/css">

   .color-block { 
       background:transparent;
       filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#50990000,endColorstr=#50990000); 
       zoom: 1;
    } 

    </style>

<![endif]-->

または（条件付きクラスを使用）

<!--[if IE 7]>    <html class="no-js ie7 oldie" lang="en"> <![endif]-->
<!--[if IE 8]>    <html class="no-js ie8 oldie" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->

   .ie8.your-selector { 
       background:transparent;
       filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#50990000,endColorstr=#50990000); 
       zoom: 1;
    }

また

これを回避する別の方法は、要素の背景画像として繰り返される1pxx1pxの透明なpngを使用することです。

于 2013-01-31T00:09:51.090 に答える