CSS透明度继承问题

可能重复：
CSS Opacity Property CSS透明度继承问题

我其中有一个透明的图像上作出层和我有一个问题存在。

当我在图层上记下任何文字时，它们也会获得相同的透明度。

我认为这是因为继承问题，并添加'position：relative'来重置我的子div，但它根本不起作用。

我只是想重置孩子div（#TXT下面）的不透明度。

这是我的代码。

<!DOCTYPE html> 
<html> 
<header> 
    <meta charset="UTF-8"> 
    <style type="text/css"> 
     *{margin: 0; padding:0; background-color: #555;} 
     #wrapper { 
      margin:0 auto; 
      background-color: white; 
      width: 922px; 
      height:349px; 
      margin-top: 150px; 
      -webkit-box-shadow: 0px 0px 7px 7px #333; 
      -moz-box-shadow: 0px 0px 7px 7px #333; 
      } 

     #ImgSection { 
      width: 922px; 
      height: 349px; 
      background-color: white; 
      position: absolute; 
      background: url("brand-new-car.jpg") -50px -200px no-repeat; 
      } 

     #TxtSection { 
      width: 322px; 
      height: 349px; 
      background-color: #222; 
      opacity: .5;   
      float: right; 
      -webkit-box-shadow: inset 3px 0px 3px 0px black; 
      -moz-box-shadow: inset 3px 0px 3px 0px black; 
      } 

      #TXT{ 
      position: relative; 
      font-size: 50px; 
      opacity: 1; 
      } 

    </style> 
    <script type="text/javascript"> 

    </script> 
</header> 
<body> 
    <div id="wrapper"> 
     <div id="ImgSection"></div> 
     <div id="TxtSection"> 
      <div id="TXT">dsdsad</div> 
     </div> 
    </div> 
</body> 
</html>

图片的大小brand-new-car.jpg是1024x768。

我想知道如何重置#TXT的不透明度。

请大家帮忙。

在此先感谢。

来源

2012-04-09 Hoon

http://stackoverflow.com/questions/8237886/css-opacity-property – c69 2012-04-09 08:20:19