好程序員web前端分享CSS3顏色值HSLA表示方式

說明:本文檔兼容性測試基礎環境爲:windows系統;IE6-IE10, Firefox6.0, Chrome13.0, Safari5.1, Opera11.51html

說明:
HSLA(H,S,L,A)

取值:
H:
Hue(色調)。0(或360)表示紅色,120表示綠色,240表示藍色,也可取其餘數值來指定顏色。取值爲:0 - 360
S:
Saturation(飽和度)。取值爲:0.0% - 100.0%
L:
Lightness(亮度)。取值爲:0.0% - 100.0%
A:
Alpha透明度。取值0~1之間。

說明:
HSL記法。
此色彩模式與HSL相同,只是在HSL模式上新增了Alpha透明度。

兼容性:前端


示例代碼(自行找測試的地方啊)web

  1. <!DOCTYPE html>
  2. <html lang="zh-cn">
  3. <head>
  4. <meta charset="utf-8" />
  5. <title>HSL_CSS參考手冊_web前端開發參考手冊系列</title>
  6. <style>
  7. .test{background-color:hsla(360,50%,50%,0.5);}
  8. </style>
  9. </head>
  10. <body>
  11. <div class="test">能看到此行背景說明你的瀏覽器支持HSLA色彩記法</div>
  12. </body>

   13.</html>windows

相關文章
相關標籤/搜索