prefers-contrast

Значение директивы @media, которое отслеживает настройки контрастности.

Время чтения: меньше 5 мин

Это незавершённая статья. Вы можете помочь её закончить! Почитайте о том, как контрибьютить в Доку.

Кратко

Секция статьи "Кратко"

Одно из значений директивы @media для проверки пользовательских настроек. Отслеживает выбор настроек контрастности в системе.

Пример

Секция статьи "Пример"
        
          
          @media (prefers-contrast: more) {  .image {    border: 3px solid black;  }}
          @media (prefers-contrast: more) {
  .image {
    border: 3px solid black;
  }
}

        
        
          
        
      

Как пишется

Секция статьи "Как пишется"

У prefers-contrast есть несколько значений:

  • no-preference — настройки контрастности по умолчанию.
  • more — контрастность увеличена.
  • less — контрастность понижена.
  • custom — выбран режим принудительных цветов. Например, режим высокой контрастности Windows.

Как понять

Секция статьи "Как понять"

prefers-contrast отслеживает любые настройки контрастности, не только режим принудительных цветов как forced-colors.