一、颜色设置 rgba
1.RGBA在RGB的基础上多了控制alpha透明度的参数。
a) 语法:
R：红色值。正整数 | 百分数
G：绿色值。正整数 | 百分数
B：蓝色值。正整数| 百分数
A：透明度。取值0~1之间
优点：RGBA比元素设置CSS的透明度更好，因为单独的颜色可以在不影响整个元素的透明度，他不会影响到元素其他的属性，比如说边框，字体同时也不会影响到其他元素的相关透明度
- demo
div{
width: 200px;
height: 200px;
background-color: rgba(10,20,245,0.5);
color: white;
}
二、HSLA
b) 语法：
H：Hue(色调,色相)。0(或360)表示红色，120表示绿色，240表示蓝色，也可取其他数值来指定颜色。取值为：0 – 360,过渡为：(红橙黄绿青蓝紫红)
S：Saturation(饱和度)。取值为：0.0% - 100.0%
L：Lightness(亮度)。取值为：0.0% - 100.0%，50%是平衡值
A：Alpha透明度。取值0~1之间。
- demo
span{
width: 200px;
height: 200px;
display: block;
background-color: hsla(360,100%,50%,0.6);
color: white;
}
三、透明度补充
1.opacity只能针对整个盒子设置透明度，子盒子及内容会继承父盒子的透明度
2.transparent 不可调节透明度，始终完全透明
3.使用rgba 来控制颜色，相对opacity ，不具有继承性
