css3 HSLA 颜色制造半透明效果
2021-04-06 17:28
标签：示例 back sla yellow width style nes code 绿色 HSL色彩模式是工业界的一种颜色标准，是通过对色调(H)、饱和度(S)、亮度(L)三个颜色通道的变化以及它们相互之间的叠加来得到各式各样的颜色的，HSL即是代表色调，饱和度，亮度三个通道的颜色，这个标准几乎包括了人类视力所能感知的所有颜色，是目前运用最广的颜色系统之一。HSLA是在HSL的基础上增加一个透明度(A)的设置。 若改css hsla(length || percentage || percentage || opacity) length：Hue(色调)。0(或360)表示红色，120表示绿色，240表示蓝色，也可取其他数值来指定颜色。取值为：0 - 360 percentage：Saturation(饱和度)。取值为：0.0% - 100.0%。饱和度是指色彩的鲜艳程度，也称色彩的纯度。饱和度取决于该色中含色成分和消色成分（灰色）的比例。含色成分越大，饱和度越大；消色成分越大，饱和度越小。饱和度为0％表示灰色。 percentage：Lightness(亮度)。取值为：0.0% - 100.0%。亮度0%就为黑，亮度最大100%则为白 opacity：Alpha透明度。取值0~1之间。 IE6～8 不支持，其他的浏览器 ok 摘自 《CSS Secrets》一书 css3 HSLA 颜色制造半透明效果 标签：示例 back sla yellow width style nes code 绿色 原文地址：https://www.cnblogs.com/everlose/p/12493336.html简介
半透明效果示例
.wrap {
background-color: black;
}
.wrap .content {
border: 10px solid hsla(0, 0%, 100%, .5);
background-color: yellowgreen;
background-clip: padding-box;
}.wrap { background-color: blue; }语法
取值
兼容性
结语
上一篇：页面点击事件向js传uuid值
下一篇：第十一节 jQuery特殊效果
文章标题：css3 HSLA 颜色制造半透明效果
文章链接：http://soscw.com/index.php/essay/72111.html