css селектор для соответствия элементу без атрибута x

Question

Я работаю над файлом CSS и нахожу необходимость стилизовать поля ввода текста, однако у меня возникают проблемы. Мне нужно простое объявление, которое соответствует всем этим элементам:

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

... но не соответствует этим:

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

Вот что я хотел бы сделать:

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

В приведенном выше CSS обратите внимание на первый селектор input[!type]. Под этим я подразумеваю, что я хочу выбрать все поля ввода, в которых атрибут type не указан (поскольку по умолчанию используется текст, но input[type='text'] не соответствует ему). К сожалению, в спецификации CSS3 нет такого селектора, который я мог бы найти.

Кто-нибудь знает способ сделать это?

Answer 1

: не селектор

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

Поддержка: в Internet Explorer 9 и выше

Answer 2

Для более кросс-браузерного решения вы могли бы ввести все , введя так, как вы хотите, чтобы не набирали текст, пароль и пароль, а другой стиль переопределяет этот стиль для радио, флажков и т. Д. *

input { border:solid 1px red; }

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

- или -

может ли какая-то часть вашего кода, которая генерирует нетипизированные входные данные, дать им класс, подобный .no-type, или просто вообще не выводить? Кроме того, этот тип выбора может быть сделан с помощью jQuery.

Answer 3

Просто хотел бы добавить к этому, вы можете иметь: not селектор в oldIE, используя selectivizr: http://selectivizr.com/