pointer-events
Обновлено: 06.01.2023
pointer-events
Свойство pointer-events позволяет управлять тем, как элементы будут реагировать на события мыши или прикосновения к сенсорному экрану. Часто применяется для того, чтобы в сложной компоновке можно было взаимодействовать с нижележащими элементами, игнорируя вышележащие.
Краткая информация
| Значение по умолчанию | auto |
| Наследуется | Да |
| Применяется | Ко всем элементам |
| Анимируется | Нет |
Синтаксис
pointer-events: auto | none
Значения
| auto | Восстанавливает функциональность элемента по умолчанию. |
| none | Предотвращает события мыши и щелчки по элементу. |
Пример
В данном примере к каждому блоку снизу добавляется псевдоэлемент с градиентом, плавно скрывающий часть текста. При этом невозможно выделить часть текста, поскольку псевдоэлемент частично перекрывает его. Чтобы этот псевдоэлемент не мешал работе с текстом, к нему добавляем свойство pointer-events со значением none.