Input kelas pseudo Css: tidak (dinonaktifkan) tidak: [type = “submit”]: fokus

Saya ingin menerapkan beberapa css untuk elemen input dan saya ingin melakukannya hanya untuk input yang tidak dinonaktifkan dan tidak mengirimkan tipe, di bawah ini css tidak berfungsi, mungkin jika seseorang dapat menjelaskan kepada saya bagaimana ini harus ditambahkan.

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

Dari pada:

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

Menggunakan:

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

disabledadalah atribut sehingga perlu tanda kurung, dan Anda tampaknya telah mencampur / menghilangkan tanda titik dua dan tanda kurung pada :not()pemilih.

Demo: http://jsfiddle.net/HSKPx/

Satu hal yang perlu diperhatikan: Saya mungkin salah, tetapi saya tidak berpikir disabledinput biasanya dapat menerima fokus, sehingga bagian itu mungkin berlebihan.

Atau, gunakan :enabled

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

Sekali lagi, saya tidak bisa memikirkan kasus di mana input yang dinonaktifkan dapat menerima fokus, jadi sepertinya tidak perlu.

Sintaks Anda cukup edan.

Ubah ini:

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

untuk:

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

Tampaknya banyak orang tidak menyadari :enableddan :disabledmerupakan penyeleksi CSS yang valid ...

Anda memiliki beberapa kesalahan ketik di pilih Anda. Harus:input:not([disabled]):not([type="submit"]):focus

Lihat jsFiddle ini untuk bukti konsep. Pada sidenote, jika saya menghapus properti "background-color", maka bayangan kotak tidak lagi berfungsi. Tidak yakin kenapa.