[html] 图层div半透明，文字不透明

以下代码兼容ie6+，firefox和chrome，目的是，使图层半透明，而文字不透明。

 

<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
< html  xmlns ="http://www.w3.org/1999/xhtml" >
< head >
< meta  http-equiv ="Content-Type"  content ="text/html; charset=utf-8"   />
< title >图层div透明，文字不透明 </ title >
< style  type ="text/css" >
body {
     background-color: #000000;
}
#container{  
    border: 1px solid #c00;  
    background-color: rgba(212,0,0,0.5);  
    background: #f00\9;  
    filter: alpha(opacity=50);  
    width: 500px;  margin: 40px auto;  
    line-height: 200%;  
    font-size: 14px;  
    padding: 14px;
    color:  #fff;
}
 #container *{  position: relative;}
</ style >
</ head >
< body >
  < div  id ="container" >
      < span >我是文字，我不透明哦～在firefox和下面，主要是使用了 background-color: rgba的 a (alpha) 这个特性，而对于ie6+，是使用了IE滤镜 filter，注意CSS代码 </ span >
     </ div >
</ body >
</ html >