В CSS псевдо входных классов:нет(отключен)не:[тип="отправить"]:фокус


Я хочу применить некоторые css для входных элементов, и я хочу сделать это только для входов, которые не отключены и не представляют тип, ниже css не работает, возможно, если кто-то может объяснить мне, как это должно быть добавлено .

input:not(disabled)not:[type="submit"]:focus{
box-shadow:0 0 2px 0 #0066FF;
-webkit-box-shadow:0 0 4px 0 #66A3FF;
}
3 88

3 ответа:

вместо:

input:not(disabled)not:[type="submit"]:focus {}

использование:

input:not([disabled]):not([type="submit"]):focus {}

disabled является атрибутом, поэтому ему нужны скобки, и вы, похоже, перепутали / пропустили двоеточия и скобки на :not() селектор.

демо: http://jsfiddle.net/HSKPx/

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

кроме того, использовать :enabled

input:enabled:not([type="submit"]):focus { /* styles here */ }

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

ваш синтаксис довольно странный.

изменить это:

input:not(disabled)not:[type="submit"]:focus{

to:

input:not(:disabled):not([type="submit"]):focus{

кажется, что многие люди не понимают :enabled и :disabled являются допустимыми селекторами CSS...

у вас есть несколько опечаток в своем выборе. Это должно быть:input:not([disabled]):not([type="submit"]):focus

посмотреть этот jsFiddle для доказательства концепции. На боковой заметке, если я удалил свойство "background-color", то тень коробки больше не работает. Не знаю почему.