CSS function contrast

Опис

Функція contrast() є частиною модуля CSS Filter Effects і використовується для зміни контрастності елемента. Вона приймає один аргумент - коефіцієнт контрастності, який визначає, наскільки контрастним буде елемент.

Значення коефіцієнта контрастності (percentage) вказується як параметр функції contrast(). Можна використовувати значення від 0% до 100% та значення більше 100%. Значення 100% залишить контрастність незмінною, значення менше 100% зменшить контрастність, а значення більше 100% збільшить контрастність.

Функція contrast() може бути використана для створення ефекту підвищення або зниження контрастності елементів на сторінці.

Декілька прикладів коректного використання функції contrast():

• contrast(50%): Зменшення контрастності елемента до 50%.
• contrast(200%): Збільшення контрастності елемента до 200%.

Зверніть увагу, що значення передається у відсотках (%).

правити

Порада

Використовуйте функцію contrast() разом з іншими фільтрами CSS, такими як blur(), brightness() або saturate(), для створення складних візуальних ефектів.

автор: Bond правити

Нотатка

Ефект contrast() також можна застосовувати до псевдоелементів, таких як ::before або ::after, для досягнення бажаного візуального ефекту.

автор: Bond правити

+ додати пораду чи нотатку

Синтаксис

contrast(<percentage>)

Функція contrast може отримувати єдине значення:

<percentage>

Значення у відсотках.

автор: Bond

правити

Переглядачі

Стаціонарні переглядачі Мобільні переглядачі

Підтримка: стаціонарні переглядачі

Переглядач
	18	35	6	15	12

Підтримка: мобільні переглядачі

Переглядач
	4.4	53	35	6

Приклади

+ запропонувати свій приклад у пісочниці