bộ chọn css để khớp với phần tử không có thuộc tính x

Question

Tôi đang làm việc trên tệp CSS và tìm thấy hộp nhập văn bản cần kiểu, tuy nhiên, tôi đang gặp sự cố. Tôi cần một lời tuyên bố đơn giản phù hợp với tất cả những yếu tố này:

<input /> 
<input type='text' /> 
<input type='password' /> 

... nhưng không phù hợp với những người:

<input type='submit' /> 
<input type='button' /> 
<input type='image' /> 
<input type='file' /> 
<input type='checkbox' /> 
<input type='radio' /> 
<input type='reset' /> 

Dưới đây là những gì tôi muốn làm:

input[!type], input[type='text'], input[type='password'] { 
    /* styles here */ 
} 

Trong CSS ở trên, hãy chú ý bộ chọn đầu tiên là input[!type]. Những gì tôi có nghĩa là bởi điều này là tôi muốn chọn tất cả các hộp đầu vào mà thuộc tính type không được chỉ định (vì nó mặc định là văn bản nhưng input[type='text'] không khớp với nó). Thật không may, không có bộ chọn như vậy trong thông số CSS3 mà tôi có thể tìm thấy.

Có ai biết cách để thực hiện việc này không?

Answer 1

: không selector

input:not([type]), input[type='text'], input[type='password'] { 
    /* style here */ 
} 

Support: trong Internet Explorer 9 và cao hơn

Answer 2

Đối với một giải pháp qua trình duyệt hơn bạn có thể phong cách tất cả đầu vào theo cách bạn muốn các phi gõ, văn bản, và mật khẩu sau đó một phong cách ghi đè mà phong cách cho radio, hộp kiểm tra, vv

input { border:solid 1px red; } 

input[type=radio], 
input[type=checkbox], 
input[type=submit], 
input[type=reset], 
input[type=file] 
     { border:none; } 

- Hoặc -

bất kỳ phần nào trong mã của bạn tạo ra các đầu vào không được nhập sẽ cung cấp cho chúng một lớp như .no-type hoặc đơn giản là không có đầu ra? Ngoài ra, loại lựa chọn này có thể được thực hiện với jQuery.

Answer 3

Chỉ muốn thêm vào đó, bạn có thể có: không Selector trong Oldie sử dụng selectivizr: http://selectivizr.com/