颜色

可以使用color CSS 媒体特性 来测试输出设备的颜色分量（红色、绿色、蓝色）的位数。

语法

color 特性指定为一个<整数>值，表示输出设备的颜色分量（红色、绿色、蓝色）的位数。如果设备不是彩色设备，则该值为零。它是一个范围特性，这意味着您还可以使用前缀min-color和max-color变体分别查询最小值和最大值。

注意：如果各种颜色分量由不同的位数表示，则使用最小的位数。例如，如果显示器使用 5 位表示蓝色和红色，使用 6 位表示绿色，则认为该设备每个颜色分量使用 5 位。如果设备使用索引颜色，则使用颜色表中每个颜色分量的最小位数。

请参阅使用 CSS 将颜色应用于 HTML 元素，以了解有关使用 CSS 将颜色应用于 HTML 的更多信息。

示例

HTML

html
<p>
  This text should be black on non-color devices, red on devices with a low
  number of colors, and greenish on devices with a high number of colors.
</p>

CSS

css
p {
  color: black;
}

/* Any color device */
@media (color) {
  p {
    color: red;
  }
}

/* Any color device with at least 8 bits per color component */
@media (min-color: 8) {
  p {
    color: #24ba13;
  }
}

结果

规范

规范
媒体查询级别 4
# 颜色

浏览器兼容性

BCD 表格仅在浏览器中加载

另请参阅