opacity/rgba()設置透明度問題

設置opacity元素的所有後代元素會隨着一起具有透明性，一般用於調整圖片或者模塊的整體不透明度。其中文字也會出現透明度，一般通過將文字放置在一個單獨<div>中，在通過絕對定位來控制位置：

div{
    opacity:0.3;
    -moz-opacity:0.3;
    filter:alpha(opacity=30);
    background:#000;
    width:500px;
    height:500px;
    color:#F30;
 }

通過rgba()來設置背景透明度解決這一問題

 div{
     //實現FF背景透明，文字不透明(非IE識別)
     background:rgba(0,0,0,0.2) none repeat scroll !important; 
     //實現IE背景透明
    background:#000; 
    filter:Alpha(opacity=20);
    width:500px; 
    color:#F30; 
}
div p{ position:relative;}實現IE文字不透明

火狐我們直接用rgba顏色就可以解決子標籤跟着半透明的問題了，但是ie還不是能很好的支持。
所以我們給不想被透明的標籤設置一個定位屬性，問題接能解決了。