Селектор SCSS/CSS для выбора всех типов ввода

У меня есть тип ввода, который имеет эту настройку scss (из фреймворка)

textarea,
input[type="text"],
input[type="password"],
input[type="datetime"],
...
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
{
  @include box-shadow(inset 0 1px 1px rgba(0,0,0,.075));
}

Мне нравится переопределять / reset все, что-то подобное

textarea,
input[type="*"],
{
  @include box-shadow(none);
}

выше не работает, также

textarea,
    input,
    {
      @include box-shadow(none);
    }

недостаточно. Есть ли способ сделать это, чем перечисление всех возможных типов.

Спасибо.

Ответ 1

Существует много возможных типов ввода. Если вы хотите, чтобы текстовые поля и любые входные данные имели атрибут типа, тогда...

textarea,
input[type] {
    ...
}

Если вы хотите исключить некоторые типы ввода, используйте селектор :not. ИЗМЕНИТЬ ПРИМЕР JSFIDDLE http://jsfiddle.net/Pnbb8/

textarea,
input[type]:not([type=search]):not([type=url]):not([type=hidden]) {

}

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

Вместо этого вы можете использовать класс CSS.

.box-shadowed
{
  @include box-shadow(none);
}

Ответ 2

Будет ли это достаточно?

input[type="text"] {
    border: 1px red;
}

input[type] {
    border: 1px solid blue; }
}

Оба они имеют одинаковую специфичность, поэтому последняя переопределяет.

См. jsFiddle: http://jsfiddle.net/TheNix/T2BbG/

Другим решением было бы исключить элемент из первого селектора. Последнее будет иметь более высокую специфичность, однако вы должны знать, что с точки зрения производительности первая аналогична использованию универсального селектора (поскольку он пытается сопоставить все элементы в DOM, чтобы проверить атрибут).

[type="text"] {
    border: 1px red;
}

input[type="text"] {
    border: 1px solid blue; }
}