Как не применять CSS на определенном теге

Question

Я не знаю, возможно ли это в CSS, но я бы хотел, чтобы общая роль не применялась к конкретному элементу в моем случае id=special. В моем примере все DIV должны быть красного цвета, но я хочу, чтобы только id=special не применял этот цвет. Я понимаю, что всегда могу перезаписать элемент с помощью id=special, но мне интересно знать, возможно ли какое-то исключение из общей роли.

Есть идеи в CSS 2 и CSS 3?

Пример:

<div>this is red</div>
<div>this is red</div>
<div id="special">this one must be blus</div>
div>this is red</div>

// My General Role
div
{
  background-color:Red;
}

Answer 1

CSS2 Solution

div {
    color: red;
}

div#special {
    color: inherit;
}

демо: http://jsfiddle.net/zRxWW/1/

Answer 2

CSS3 позволяет использовать селектор :not():

div:not([id])
-or-
div:not(#special)
depending on what you want to exclude

Вы можете прочитать все о селекторах в документах w3c .

Что касается CSS2, есть ограниченный набор селекторов , и они не учитывают отрицание.

Answer 3

CSS3 решение:

div:not(#special)

Answer 4

Это отличный пример того, как работает специфика CSS. Общее правило, применяемое ко всем элементам определенного типа (правило div, окрашивающее фон в красный), заменяется более конкретным правилом, применяемым к идентификатору. Эта концепция существует с CSS1 и доступна во всех браузерах. Таким образом:

div {
  background-color:red;
}
#special {
 background-color: blue;  
}

... оставит все divs красными. Применяя идентификатор special к div, этот один div будет синим вместо.

Посмотри в действии: http://jsfiddle.net/9Hyas/

Ознакомьтесь с этими статьями, чтобы узнать больше о специфике CSS: http://coding.smashingmagazine.com/2007/07/27/css-specificity-things-you-should-know/ и http://www.htmldog.com/guides/cssadvanced/specificity/

Answer 5

Возможно, вы захотите использовать div:not(#special), но если он все равно будет синим, то вы можете просто переопределить правило. Селектор :not() является свойством CSS3 и поэтому поддерживается не всеми браузерами.