prefers-reduced-transparency

Експериментальне

Це експериментальна технологія.
Перед її використанням у промисловій розробці уважно перевірте Таблицю сумісності з браузерами.

Ознака медіа CSS prefers-reduced-transparency (віддає перевагу зниженій прозорості) використовується для з'ясування того, що користувач ввімкнув на своєму пристрої налаштування для зниження прозорих чи напівпрозорих шарових ефектів, що на цьому пристрої застосовуються. Ввімкнення такого налаштування може допомогти покращити контрастність та читабельність для деяких користувачів.

Синтаксис

no-preference

Позначає те, що користувач не вказав на пристрої своїх уподобань. Це значення – ключове слово у булевому контексті розцінюється як хибність.

reduce

Позначає те, що користувач увімкнув на своєму пристрої налаштування для мінімізації кількості прозорих чи напівпрозорих шарових ефектів.

Користувацькі налаштування

Різні операційні системи пропонують налаштування для зниження використання прозорості, і користувацькі агенти, ймовірно, покладаються на ці системні налаштування. Також вони можуть покладатися на менш явні сигнали на платформах, що не пропонують такого окремого налаштування.

  • У Windows 10 та 11: Налаштування > Персоналізація > Кольори > Ефекти прозорості.
  • У macOS: Системні налаштування > Доступність > Дисплей > Менше прозорості.
  • В iOS: Параметри > Доступність > Дисплей і розмір тексту > Зменшити прозорість.

Приклади

Цей приклад усталено містить напівпрозору рамку. Якщо на пристрої ввімкнено налаштування для зниження прозорості, рамка стає менш прозорою.

HTML

<div class="translucent">напівпрозора рамка</div>

CSS

.translucent {
  opacity: 0.4;
}

@media (prefers-reduced-transparency) {
  .translucent {
    opacity: 0.8;
  }
}

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

Якщо ви це бачите — значить, щось трапилося з цією сторінкою.

Сумісність із браузерами

Якщо ви це бачите — значить, щось трапилося з цією сторінкою.

Дивіться також

Помітили помилку на цій сторінці?

Переглянути сирці на GitHub.

Редагувати вміст на GitHub.

Почати обговорення на GitHub стосовно вмісту цієї сторінки.