Movatterモバイル変換


[0]ホーム

URL:


  1. Веб-технологии для разработчиков
  2. CSS: каскадные таблицы стилей
  3. Руководство по CSS
  4. Selectors
  5. :enabled

This page was translated from English by the community.Learn more and join the MDN Web Docs community.

View in EnglishAlways switch to English

:enabled

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since ⁨июль 2015 г.⁩.

Описание

CSSпсевдокласс:enabled находит любой включённый элемент. Элемент включён, если его можно активировать (например, выбрать, нажать на него или ввести текст) или поставить фокус. У элемента также есть отключённое состояние, когда его нельзя активировать или сфокусировать.

Пример

Следующий пример делает цвет текста средне-зелёного оттенка, когда поле включено, и серым, когда отключено. Это позволяет понимать пользователю какие элементы интерактивны, а какие нет.

Следующий HTML...

html
<form action="url_of_form">  <label for="FirstField">Первое поле (включено):</label>  <input type="text" value="Lorem" /><br />  <label for="SecondField">Второе поле (отключено):</label>  <input type="text" value="Ipsum" disabled="disabled" /><br />  <input type="button" value="Submit" /></form>

...используем со следующим CSS...

css
input:enabled {  color: #22aa22;}input:disabled {  color: #d9d9d9;}

...результат:

Заметьте, цвет текста кнопки также зелёный, так как она тоже включена.

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

Specification
HTML
# selector-enabled
Selectors Level 4
# enabled-pseudo

Совместимость с браузерами

Смотрите также

Help improve MDN

Learn how to contribute

This page was last modified on byMDN contributors.


[8]ページ先頭

©2009-2025 Movatter.jp