Ввод псевдоклассов Css: не (отключено) не:[type= "submit"]: фокус

Я хочу применить 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 ответов


вместо:

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{

в:

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

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


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

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