html5 / css3: отключен псевдокласс - работает?как отобразить?какие эффекты это имеет?

Question

псевдо-класс css3: отключен

• это еще поддерживается - думал, что это было, но не может заставить его летать в chrome
  • попытался установить div.disabled = true;
  • попытался установить div.endabled = false;
  по-прежнему не радует
• , если хотите показать весь DIV отключенным, как я могу затемнить «серый»"весь DIV, не зная его фоновых цветов?
• если DIV отключен, отключены ли входы и входы A (nchor)?

Мое решение: закройте область страницы, которая должна быть отключена, полупрозрачной страницей с более высоким z-индексом - это предотвращает любое взаимодействие со страницей ниже.

Answer 1

Лучший ответ на ваш вопрос - определить, что такое отключенный элемент.

http://www.w3.org/TR/2000/WD-css3-userint-20000216#pseudo-disabled

2.1.3 Псевдокласс: disabled

Аналогично: enabled,: disabled позволяет автору точно указывать, как должен выглядеть отключенный или неактивный элемент пользовательского интерфейса.

Следует отметить, что большинство элементов не будут ни включены, ни отключены.Элемент включается, если пользователь может либо активировать его, либо перенести на него фокус.Элемент отключен, если он может быть включен, но пользователь не может активировать его или перенести на него фокус.

: отключен, поддерживается в Chrome - проверьте пример jsfiddle: http://jsfiddle.net/easwee/zCVGV/3/

Answer 2

1. Я уверен, что вы не можете добавить отключенный атрибут к тегу <div>, только к тегам <input />, <fieldset> и <command>. Может быть, вместо этого добавьте <fieldset disabled> вокруг ваших <input /> элементов?

2. Используйте цвета или непрозрачность rgba, чтобы придать отключенным элементам внешний вид, или цвета hsl и уменьшите насыщенность, чтобы придать отключенным элементам черно-белый вид

3. Если вы используете <fieldset disabled> Я думаю, что это отключит все элементы <input />, содержащиеся в нем.

Answer 3

Quirksmode включает селектор :disabled в таблице совместимости.

Согласно этой таблице, стиль широко поддерживается во всех браузерах, кроме IE, где он только недавно был добавлен с IE9.

Однако вы можете использовать селектор attr, чтобы сделать то же самое:

.myclass[disabled] { .... }

(практически) совпадает с

.myclass:disabled { .... }

с тем преимуществом, что он работает в IE7 и IE8.