CSS3顏色不透明度如何設定

　　web前端技術包含HTML和CSS樣式，兩者是相輔相成的，學習CSS樣式不必可少，那麼在學習CSS樣式中，CSS3顏色不透明度如何設定?在CSS3之前，我們設定顏色的方式包含十六進位制顏色(如#F00)、rgb模式顏色、或指定顏色的英文名稱(如red)，但這些方法無法改變顏色的不透明度。在CSS3中新增了兩種設定顏色不透明度的方法，一種是使用rgba模式設定，另一種是使用opacity屬性設定。下面將詳細講解兩種設定方法。

　　1. rgba模式

　　rgba是CSS3新增的顏色模式，它是rgb顏色模式的延伸。rgba模式是在紅、綠、藍三原色的基礎上新增了不透明度引數，其語法格式如下。

　　rgba(r,g,b,alpha);

　　上述語法格式中，前三個引數與RGB中的引數含義相同，括號裡面書寫的是rgb的顏色色值或者百分比，alpha引數是一個介於0.0(完全透明)和1.0(完全不透明)之間的數字。

　　例如，使用rgba模式為p標籤指定透明度為0.5，顏色為紅色的背景，程式碼如下。

　　p{background-color:rgba(255,0,0,0.5);}

　　或

　　p{background-color:rgba(100%,0%,0%,0.5);}

　　2. opacity屬性

　　opacity屬性是CSS3的新增屬性，該屬效能夠使任何元素呈現出透明效果，作用範圍要比rgba模式大得多。opacity屬性的語法格式如下。

　　opacity：引數;

　　上述語法中，opacity屬性用於定義標籤的不透明度，參數列示不透明度的值，它是一個介於0~1之間的浮點數值。其中，0表示完全透明，1表示完全不透明，而0.5則表示半透明。

　　CSS3顏色不透明度如何設定?以上就是小編的詳細介紹，希望上面的介紹能夠給大家帶來幫助。

　　 本文來自千鋒教育，轉載請註明出處。