Css pseudo classes input: not (disabled) không: [type = "submit"]: focus

Question

Tôi muốn áp dụng một số css cho các yếu tố đầu vào và tôi muốn làm điều đó chỉ cho đầu vào không bị vô hiệu hóa và không gửi loại , dưới đây css không hoạt động, có thể nếu ai đó có thể giải thích cho tôi cách thức này phải được thêm vào.

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

Answer 1

Thay vì:

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

Sử dụng:

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

disabled là một thuộc tính vì vậy nó cần các dấu ngoặc, và bạn dường như đã lẫn lộn/dấu hai chấm mất tích và dấu ngoặc trên Bộ chọn :not().

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

Một điều cần lưu ý: Tôi có thể sai, nhưng tôi không nghĩ rằng disabled đầu vào thường có thể nhận được tập trung, vì vậy một phần mà bạn có thể không cần thiết.

Answer 2

Bạn có một vài lỗi chính tả trong lựa chọn của mình. Nó phải là: input:not([disabled]):not([type="submit"]):focus

Xem điều này jsFiddle để có bằng chứng khái niệm. Trên một sidenote, nếu tôi loại bỏ thuộc tính "background-color", thì shadow box không còn hoạt động nữa. Không chắc chắn lý do tại sao.

Answer 3

Cú pháp của bạn khá ngớ ngẩn.

Thay đổi này:

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

tới:

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

vẻ mà nhiều người không nhận ra :enabled và :disabled là selectors CSS hợp lệ ...