Свойство color-scheme
Описание
Позволяет элементу указать, в каких цветовых схемах он может удобно отображаться.
Обычный выбор цветовых схем операционной системы: «светлый» и «темный» или «дневной режим» и «ночной режим». Когда пользователь выбирает одну из этих цветовых схем, операционная система вносит коррективы в пользовательский интерфейс.
Сюда входят элементы управления формы, полосы прокрутки и используемые значения системных цветов CSS.
Синтаксис
color-scheme: normal | dark | light | only;Подробности
| Значение | Описание |
| normal | Указывает, что элементу не известны какие-либо цветовые схемы, поэтому он должен отображаться с использованием цветовой схемы браузера по умолчанию. |
| light | Указывает, что элемент может отображаться с использованием схемы светлых цветов операционной системы. |
| dark | Указывает, что элемент может отображаться с использованием темной цветовой схемы операционной системы. |
| only | Запрещает пользовательскому агенту переопределять цветовую схему элемента. |
Пример
<!DOCTYPE html>
<html lang='ru'>
<head>
<meta charset='UTF-8'>
<meta name='viewport' content='width=device-width, initial-scale=1.0'>
<title>Document</title>
</head>
<body>
<style>
#test {
width: 300px;
padding: 10px;
background-color: white;
color: black;
color-scheme: dark;
}
</style>
<div id='test'>Далеко-далеко за словесными горами в стране.</div>
</body>
</html>Читайте также
Свойство page-break-inside
Разрешает или запрещает разрыв страницы внутри элемента при печати....
Свойство letter-spacing
Определяет интервал между символами в пределах элемента. Допустимо использовать отрицательное значение....
Свойство page-break-before
Добавляет разрыв страницы при печати документа перед заданным элементом....
Свойство outline-width
Указывает толщину внешней границы элемента.
В отличие от свойства border-width, для outline-width нельзя задать границу для каждой стороны элем...