站長(zhǎng)資訊網(wǎng)
方法：1、利用rgba()函數(shù)，語(yǔ)法為“rgba(紅色值,綠色值,藍(lán)色值,透明度值);”；2、利用opacity屬性，語(yǔ)法為“opacity:透明度值;”；3、利用filter屬性，語(yǔ)法為“filter:opacity(透明度值);”。
本教程操作環(huán)境：windows7系統(tǒng)、CSS3&&HTML5版、Dell G3電腦。
css3透明度的設(shè)置方法
1、利用rgba() 函數(shù)使用紅(R)、綠(G)、藍(lán)(B)、透明度(A)的疊加來(lái)生成各式各樣的顏色。
RGBA 即紅色、綠色、藍(lán)色、透明度（英語(yǔ)：Red, Green, Blue、Alpha）。
紅色（R）0 到 255 間的整數(shù)，代表顏色中的紅色成分。綠色（G）0 到 255 間的整數(shù)，代表顏色中的綠色成分。藍(lán)色（B）0 到 255 間的整數(shù)，代表顏色中的藍(lán)色成分。透明度（A）取值 0~1 之間， 代表透明度。
輸出結(jié)果：
2、利用opacity 屬性設(shè)置元素的不透明級(jí)別。代碼如下：
<!DOCTYPE html> <html> <head> <style> div { background-color:red; opacity:0.5; filter:Alpha(opacity=50); /* IE8 以及更早的瀏覽器 */ } </style> </head> <body> <div>本元素的不透明度是 0.5。請(qǐng)注意，文本和背景色都受到不透明級(jí)別的影響。</div> </body> </html>
輸出結(jié)果：
3、利用filter 屬性定義了元素(通常是<img>)的可視效果(例如：模糊與飽和度)。代碼如下：
<!DOCTYPE html> <html> <head> <style> img { -webkit-filter:opacity(50%); /* Chrome, Safari, Opera */ filter: opacity(50%); } </style> </head> <body> <p>圖片轉(zhuǎn)為透明:</p> <img src="pineapple.jpg" alt="Pineapple" width="300" height="300"> </body> </html>
輸出結(jié)果：
（學(xué)習(xí)視頻分享：css視頻教程）
