0. 写在前面
没想到在CSS里也要再次了解这些颜色单位，感觉回到了大二的数字图像处理，可惜现在已经大四了，感觉并没有学会什么AI的东西
1. 颜色单位
-
预定义颜色名：HTML和CSS规定了147种颜色名。例如：red yellow green blue
-
RGB颜色值
rgb(red, green, blue)：括号中每个参数代表对应颜色的浓度
浓度值是0-255之间的整数，0表示无浓度，255表示最大浓度
也可以使用百分比表示浓度 0%~100% -
十六进制颜色值
#RRGGBB：RR-红色 GG-绿色 BB-蓝色，每种颜色使用十六进制整数表示浓度
十六进制（满十六进一）：0 1 2 3 4 5 6 7 8 9 A B C D E F
例如：#ff0000
若每种颜色的两位数值都一样可以简写为：#f00 -
RGBA：相较于RGB多了个A表示透明度，取值范围在0.0~1.0之间
0.0表示透明 1.0表示不透明 0.5表示半透明 -
HSL/HSLA
H 色调（0-360）0红色->120绿色->240蓝色
S 饱和度（0%-100%） 0%灰色->100%全彩
L 亮度（0%-100%） 0%黑色->100%白色
A透明度（0.0-1.0） 0.0透明->1.0不透明
示例如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
.div1 {
width: 200px;
height: 200px;
/* background-color: red; */
/* background-color: rgb(255, 200, 0); */
/* background-color: rgb(100%, 0%, 0%); */
/* background-color: #f00; */
/* background-color: rgba(255, 0, 0, 0.5); */
background-color: hsla(0, 100%, 50%, .3);
}
</head>
<body>
<div class="div1"></div>
</body>
</html>
实际网页开发感觉hsla用的不多，主要还是以十六进制或rgb为主
