在css中有很多好看的樣式都可以實現,css設定出來的樣式讓整個網頁看起來也會非常美觀,今天的這篇文章就給大家來介紹一下在css中怎麼設定字體的透明度,讓你的字體在網頁中看起來是透明的。
在css3新增了一個rgba屬性,所謂rgba屬性,就是R(紅)G(綠)B(藍色)三原色加ALPHA(透明度),下面我們就來具體看看這個rgba屬性如何設定字體透明度。
首先利用RGBA來設定背景顏色透明度是非常簡單的,我們來簡單看一個例子:(相關推薦:css如何設定背景顏色透明?)
<!DOCTYPE html> <html> <head> <title></title> <style type="text/css"> .div{ background-color:rgba(220,38,38,0.2); width:100px; height:100px; } </style> </head> <body> <div class="div"> 我是文字 </div> </body> </html>
RGBA來設定背景顏色透明度的效果如下:
#上述程式碼是不是很簡單,那麼如果將字體設定透明度我們可以如何利用RGBA呢?
其實也非常簡單,設定字體的透明度,我們可以對color的rgba屬性進行設定。
我們來看看RGBA設定字體透明度的具體範例:
<!DOCTYPE html> <html> <head> <title></title> <style type="text/css"> .div{ background:red; width:100px; height:100px; color:rgba(255,255,255,0.4) } </style> </head> <body> <div class="div"> 我是透明文字 </div> </body> </html>
字體透明度的效果如下:
這篇文章到這裡就全部結束了,關於css中透明度設定的相關內容大家可以去php中文網的css影片教學、css3影片教學欄位學習。
以上是CSS字體透明度怎麼設定?的詳細內容。更多資訊請關注PHP中文網其他相關文章!