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

Question

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

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

Answer 1

Вместо:

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 */ }

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

Answer 2

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

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

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

до:

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

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

Answer 3

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

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