Установить стиль только для элементов, которые не отображаются

Question

Как можно установить стиль только для не "наведенных" элементов?

Например:

<input id="1"/>
<input id="2"/>
<input id="3"/>
<input id="4"/>

Вход 3 наведен.И я хочу, чтобы он имел значение по умолчанию.

input {
  background-color:red;
}

Answer 1

Сбросить его в элементе hovered:

input {
  background-color: red;
}

input:hover {
  background-color: transparent;
}

transparent - это значение по умолчанию для background-color, если ничего не установлено, поэтому при явной установке его значение будет равно значению по умолчанию.

Answer 2

Правильно ли я понял, если вы хотите одно состояние по умолчанию для каждого элемента ввода (все четыре из них), когда ни один из них не наведен, а когда один элемент наведен, все остальные получают другой стиль?

Если так, может быть, вы могли бы сделать это с:

input {
  background-color: red; /* this is the default when none is hovered */
}
#containerForInputs:hover input {
  background-color: yellow; /* this is the default for all except the one item that is hovered */
}
#containerForInputs input:hover {
  background-color: blue; /* this is the style for the hovered item */
}

Что-то подобное?(Я сам не пробовал, но думаю, что должно сработать)

Answer 3

Я не совсем понимаю, что вы спрашиваете, но это может помочь

input:not(:hover) {
}

Кстати, это селектор CSS3, поэтому он не будет поддерживать устаревшие браузеры.

http://kilianvalkhof.com/2008/css-xhtml/the-css3-not-selector/

Answer 4

Я не уверен, что вы подразумеваете под "не не завис". Для этого нужно установить стиль по умолчанию, а затем отдельный стиль для «зависания»:

input {
    background-color: red;
}

input:hover {
    background-color: grey;
}

Answer 5

не уверен, что вы ищете, но попробуйте это:

input {
  background-color:blue;
}
input:hover {
  background-color:red;
}

http://jsfiddle.net/eMPKD/