HOW - CSS 定义颜色值

在CSS中，您可以通过多种方式定义颜色值。以下是一些常见的方法：

1. 预定义的颜色名称：这些是由CSS规范预定义的标准颜色名称，例如 "red"、"blue"、"green" 等。

p {
  color: red;
}

2. 十六进制值：十六进制颜色值由6个十六进制数字组成，分别代表红、绿和蓝色的强度。它们始终以 "#" 开头。

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

3. RGB 值：RGB 值指定了红、绿、蓝三个颜色通道的数值，每个通道的数值范围从0到255。

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

4. RGBA 值：RGBA 值是RGB值的扩展，添加了一个 alpha 通道，代表颜色的透明度。

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

5. HSL 值：HSL 值使用色调（Hue）、饱和度（Saturation）和亮度（Lightness）来定义颜色。

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

6. HSLA 值：HSLA 是 HSL 的扩展，添加了 alpha 通道，定义了颜色的透明度。

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

7. 当前颜色的变化：CSS4 中定义的色彩函数 color() 允许更为复杂的颜色变化。

p {
  color: color(display-p3 1 0 0); /* 在特定色彩空间中的红色 */
}

以上各种方法可以根据您的需求和个人喜好选择使用。