Цвет

Базовая поддержка Широко доступна

Эта функция хорошо отработана и работает на многих устройствах и версиях браузеров. Она доступна в браузерах с июля 2015 года.

Свойство CSS свойство среды позволяет проверить количество битов на компонент цвета (красный, зелёный, синий) устройства вывода.

Синтаксис

Функция color задаётся как значение <integer>, представляющее количество битов на компонент цвета (красный, зелёный, синий) устройства вывода. Если устройство не является цветным, значение равно нулю. Это функция диапазона, что означает, что вы также можете использовать префиксные min-color и max-color варианты для запроса минимального и максимального значений соответственно.

Примечание: Если различные цветовые компоненты представлены разным количеством битов, используется наименьшее значение. Например, если дисплей использует 5 бит для синего и красного и 6 бит для зелёного, то устройство считается использующим 5 бит на цветовой компонент. Если устройство использует индексированные цвета, используется минимальное количество битов на цветовой компонент в цветовой таблице.

См. Применение цвета к HTML-элементам с помощью CSS, чтобы узнать больше о применении цвета к HTML с помощью CSS.

Примеры

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

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;
  }
}

Результат

Спецификации

Спецификация
Media Queries Level 4 # цвет

Совместимость с браузерами

	Рабочие столы					Мобильные устройства
	Хром	Эдж	Файрфокс	Опера	Сафари	Хром для Android	Файрфокс для Android	Опера для Android	Сафари для iOS	Samsung Internet	WebView для Android
`color`	1	12	2	10	3	18	4	10.1	1	1.0	≤37

См. также

Свойство CSS color
Единица данных CSS <color>

© 2005–2024 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/CSS/@media/color