Zitat:
|
Zitat von netspy
Darauf würde ich aber nicht bauen. In den Specs finde ich nichts, was dieses Verhalten so vorschreibt. !important-Regeln sind ja eigentlich unabhängig von der Spezifität und ich hätte dann auch erwartet, dass die letzte Regel gewinnt. Keine Ahnung, wie sich das W3C das wirklich gedacht hat. Vielleicht wird es ja in CSS3 mal etwas präziser definiert.
Eine important-Regel überschreibt also grundsätzlich jede andere nicht-important Regel - egal welche Spezifität diese hat. |
In 6.4.1. wird das doch beschrieben oder etwa nicht?
Zitat:
# Sort by importance (normal or important) and origin (author, user, or user agent). In ascending order:
1. user agent style sheets
2. user normal style sheets
3. author normal style sheets
4. author important style sheets
5. user important style sheets
# Sort by specificity of selector: more specific selectors will override more general ones. Pseudo-elements and pseudo-classes are counted as normal elements and classes, respectively.
|
Erst wird nach "Wichtigkeit" sortiert, anschließend nach Spezifität.
Es ist zwar ein bisschen spät für sowas, aber ich versuche es mal so zu erklären wie es meiner Meinung nach zu verstehen ist.
Code:
<a class="b">Link</a>
a {
color:red !important;
}
a.b {
color:blue;
}
Der Link ist rot. Warum? Es funktioniert so:
1. Zuerst werden die Eigenschaften für <a> ermittelt die in Frage kommen, das wären "color:blue" und "color:red !important".
2. Die zweite Regel ist wichtiger (erst wird nach Wichtigkeit sortiert) und dementsprechend fliegt "color:blue" raus.
3. Wenn jetzt noch nach Spezifität sortiert wird, bleibt nur noch "color:red !important" über, sodass es automatisch in Kraft tritt.
Zusätzliches Beispiel:
Code:
<a class="b">Link</a>
a {
color:red !important;
}
a.b {
color:blue !important;
}
Der Link ist blau (bzw. sollte es sein, habe nicht getestet).
1. "color:red !important" und "color:blue !important" kommen in Frage.
2. Beide Regeln sind gleichwichtig, es wird also erstmal keine rausgeschmissen.
3. "color:blue !important" hat eine höhere Spezifität, also fliegt "color:red !important" raus.
Also eigentlich alles ganz klar definiert
