pointer-events

Свойство pointer-events управляет тем, как элемент будет реагировать на указатель (pointer): наведение или клик курсора мыши, тап на сенсорном экране, соответствующие события из JavaScript.

Кнопка не будет реагировать на нажатие указателем:

        
          
          button {  pointer-events: none;}
          button {
  pointer-events: none;
}

        
        
          
            
            Скопировать
            Скопировано
            Не удалось скопировать
          
        
      

Но если на ней сфокусироваться с клавиатуры и нажать пробел, то она нажмётся.

• none — запрещает элементу реагировать на указатель.
• auto — элемент реагирует на указатель (значение по умолчанию).

В примере ниже есть два абзаца текста с наложенным поверх них псевдоэлементом с градиентом. В первом случае если попытаться выделить текст с нижней строки, то ничего не получится. Псевдоэлемент не пропустит указатель ниже, перехватит его. Второму абзацу прописано pointer-events: none и поэтому псевдоэлемент становится невидимым для указателя, текст можно выделить и, например, скопировать.

Существует ещё 8 возможных значений для этого свойства, но они применимы только к SVG-элементам. Подробнее о них можно почитать в спецификации.