css中的颜色分为四大类：
1.用英语，比如 red，blue等
2.用16进制： 比如#000000（黑色） ，#0000FF（蓝色）等
3.rgb：这个就比较特殊了，这个还分为rgb和rgba
rgb有三个值：分别代表红 绿 蓝的量，相当于进行调色。
1.可以用百分比（0到100%） 2.用整数：0到255之间的数字
rgba：有四个值：前三分别代表红 绿 蓝的量，相当于进行调色。
然后第四个值，用来表示颜色的透明度。0到1之间，0为完全透明，白色，1为本来颜色。可以为小数 0.1,0.2。。。，可以为百分数 50%，75%....
4.hsl和hsla：
官方定义：功能符号：hsl(H, S, L[, A])或hsla(H, S, L, A)H（色调）是CSS颜色模块级别4<angle>中degs，rads，grads或turns中给出的颜色圆圈。当写为无单位时，它被解释为度数，因为它在CSS颜色模块级别3中指定。根据定义，红色= 0deg = 360deg，其他颜色围绕圆圈展开，因此绿色= 120deg，蓝色= 240deg，依此类推。作为一个，它隐含地包围-120deg = 240deg，480deg = 120deg，-1turn = 1turn等。<number><angle>S（饱和度）和L（亮度）是百分比。100% 饱和度完全饱和，而0%完全不饱和（灰色）。100% 亮度为白色，0%亮度为黑色，50%亮度为“正常”。A（阿尔法）可以是一个<number>之间0和1，一个或<percentage>，其中的数字1对应于100%（完全不透明）。功能符号：hsl(H S L[ A])或hsla(H S L A)CSS Colors Level 4在功能表示法中添加了对空格分隔值的支持。
我没有查官方文档之前，其实我是不知颜色还可以用这个来表示的，这俩个跟上面rgb和rgba很像，只不过数字代表的意思不同，定义的角度不同
第一个数字代表色调，百度了一下，就是一个盘，颜色分布在上面，用度数来选择某个颜色
第二个是饱和度，借用官方的：S（饱和度）和L（亮度）是百分比。100% 饱和度完全饱和，而0%完全不饱和（灰色）
第三个是亮度，第四个是熟悉的透明