: отключен - CSS-хитрости | CSS Альманах 2024

:disabledСелектор псевдо-класс обеспечивает условный стиль для HTML - элементов , которые могут принимать пользовательский ввод, когда элементы имеют disabledатрибут. Он определен в спецификации CSS Selectors Level 3 как «псевдокласс состояния элемента пользовательского интерфейса», что означает, что он используется для стилизации содержимого на основе взаимодействия пользователя с элементом ввода.

Элементы , которые могут принимать disabledатрибут включают , , , , и . Существует два допустимых синтаксиса для установки этого атрибута: либо disabled="disabled"или (в HTML5) просто disabledключевое слово Boolean. Элемент отключен, если его нельзя активировать (например, выбрать, щелкнуть или принять ввод текста) или принять фокус.

Такой элемент можно стилизовать с помощью :disabledселектора псевдокласса:

Посмотрите на эту ручку!

Точки интереса

:disabledмогут быть «связаны» с другими псевдоселекторами: вроде :beforeили :afterдля создания значков или текста, чтобы обеспечить дополнительную обратную связь с пользователем.
Любое свойство, которое можно анимировать с помощью переходов или анимации CSS, будет правильно анимировано при disabledдобавлении или удалении атрибута из элемента HTML.