3

フッターを透明にしようとしていますが、フッターのコンテンツも同じ透明に変更されるのはなぜですか？

CSS-

**.footer {
background: #000000;
opacity:0.6;
filter:Alpha(opacity=60); /* IE8 and earlier */
margin-top: 2em;
float: left;
width: 800px;
height: 175px;
clear:both
margin-left: auto;
margin-right: auto;
line-height: 1.0em;}**

次に、私のコンテンツは上にある別々のクラスにあります。そのコンテンツを上に配置し、フッターの背景/フッターラッパーのみに色を付けるにはどうすればよいですか？

4

1 に答える 1

7

最善の策は、透明な背景を使用することです。

.footer {
  opacity: 1; // Leave this as 1
  background-color: rgba(0,0,0,0.6); // This is in the form rgba(R,G,B,a) where a is your opacity
  // The rest of your CSS
}

<head>また、IEのサポートを維持するには、このようなものをタグに入れる必要があります

<!--[if IE]>

 <style type="text/css">
   .footer { 
     background:transparent;
     filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#3C000000,endColorstr=#3C000000); 
     zoom: 1;
   } 
 </style>

<![endif]-->

ここ#3C000000で、はaRGBの形式で、不透明度は16進数です（つまり3C、60％です）。詳細については、 csstricksを参照してください。

フレッド。

于 2013-03-02T21:52:17.727 に答える