HSL颜色笔录

今天看到一个新的定义颜色属性HSL，以前没有用到，这里备注学习下

 

【概述】

      像十六进制和RGB定义颜色一样，css3还支持HSL（色调Hue，饱和度saturation，亮度Lightness的定义方式

【兼容】

支持的浏览器有Chrome,Opera 9.5, Safari 3, Konqueror 和 Mozilla ，IE8及以下版本不支持

【详解】

采用hsl的方式，有三个参数值：色调Hue，饱和度saturation，亮度Lightness

①hue(色调)：0(或360)表示红色，120表示绿色，240表示蓝色，当然可取其他数值来确定其他颜色；

②Saturation（饱和度）：取值为0%到100%之间的值；

③Lightness（亮度）：取值为0%到100%之间的值

【语法】

  1 . 红色背景

background-color: hsl(0,100%, 50%); 

  2 . 透明度HSLA

 HSLA------与RGBA类似（RGBA指的是在RGB的基础上多了个控制alpha透明度的参数，取值在0到1之间）

 HSLA就是在HSL的基础上多了个控制alpha透明度的参数，取值在0到1之间

 例如：透明度为0.2的红色背景

background-color: hsla(0,100%, 50%,0.2);

 

 

 

有了这些全新的颜色定义方法，以后我们定义颜色时就可以更灵活了。

 

 

 

.