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

206

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

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

  • 0
    Селекторы jQuery: используйте .not (). $ ("[data-plot-id]"). not ('[data-bean-id]'). css ({border: '5px solid red'})
Теги:
css-selectors

3 ответа

328
Лучший ответ

: не селектор

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

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

  • 0
    Я пытался для <img alt = ""> img: not [src = ""] {visibility: hidden; ширина: 0; высота: 0; } но не работает, пожалуйста, помогите
  • 0
    Anoops, вы определенно должны создать новый вопрос.
25

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

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.

7

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

Ещё вопросы

Сообщество Overcoder
Наверх
Меню