16.CSS中使用颜色

在CSS中使用颜色，你可以通过以下几种方式指定颜色：

1. 预定义的CSS颜色名称：这些是预定义好的颜色，如red、blue、green等。

p {
  color: red;
}

2. 十六进制颜色代码：使用红绿蓝（RGB）颜色模型的十六进制值。

p {
  color: #FF0000; /* 红色 */
}

3. RGB值：使用rgb()函数指定颜色，参数是红绿蓝三个颜色分量的数值，每个数值范围从0到255。

p {
  color: rgb(255, 0, 0); /* 红色 */
}

4. RGBA值：使用rgba()函数指定颜色，参数包括红绿蓝三个颜色分量和透明度（alpha），透明度的值从0（完全透明）到1（完全不透明）。

p {
  color: rgba(255, 0, 0, 0.5); /* 半透明的红色 */
}

5. HSL值：使用hsl()函数指定颜色，参数包括色调（Hue）、饱和度（Saturation）和亮度（Lightness）。

p {
  color: hsl(0, 100%, 50%); /* 红色 */
}

6. HSLA值：使用hsla()函数指定颜色，参数包括色调、饱和度、亮度和透明度。

p {
  color: hsla(0, 100%, 50%, 0.5); /* 半透明的红色 */
}

7. 使用CSS变量：通过自定义属性，你可以在多个CSS属性中重复使用同一个颜色值。

:root {
  --main-color: #FF0000; /* 定义颜色变量 */
}
 
p {
  color: var(--main-color); /* 使用颜色变量 */
}

选择颜色表示方法时，考虑你的颜色需要在不同的上下文中保持一致性、可读性和可维护性。