专注收集记录技术开发学习笔记、技术难点、解决方案
网站信息搜索 >> 请输入关键词:
您当前的位置: 首页 > Web前端

HSL色彩笔录

发布时间:2010-05-20 14:01:29 文章来源:www.iduyao.cn 采编人员:星星草
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);

 

 

 

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

 

 

 

.

友情提示:
信息收集于互联网,如果您发现错误或造成侵权,请及时通知本站更正或删除,具体联系方式见页面底部联系我们,谢谢。

其他相似内容:

热门推荐: