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

Я работаю над файлом 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 нет такого селектора, который я мог бы найти.

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

Ответ 1

: не селектор

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

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

Ответ 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.

Ответ 3

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