CSS Spezifität ist Basis-Unendlich

Es gibt eine gute Menge an Informationen zu diesem Thema auf dieser Seite. Das maßgebliche ist Specifics on CSS Specificity, das im Laufe der Jahre mehrmals aktualisiert wurde. Als es ursprünglich 2008 veröffentlicht wurde, stellte es die Informationen auf eine etwas irreführende Weise dar. Das wurde längst behoben, aber der Fehler ist immer noch interessant.

Der ursprüngliche Artikel stellte die Spezifität als ganze Zahl dar, sodass ein Selektor wie #main article.news p:first-child als 0122 für 1 ID, 2 Klassen und 2 Elemente aufgeführt worden wäre. Der Fehler? Das lässt es wie ein System zur Basis 10 erscheinen. Nehmen wir an, der Spezifitätswert war 0129 – wenn es ein System zur Basis 10 wäre, würde das Hinzufügen eines weiteren Elementselektors daraus 0130 machen, was **definitiv nicht passiert**.

Jonathan Snook hat mich ursprünglich korrigiert

… wenn ein Element 11 Klassen zugewiesen hätte, würde es ein Element mit einem einzelnen ID-Selektor nicht übertreffen.

Und Eric Meyer hat bestätigt

Spezifität ist nicht Basis 10. Es ist nicht Basis von irgendetwas Vertrautem: Tatsächlich haben Spezifitätswerte eine **unendliche Basis**.

(Sie können sogar einen Abkömmling Harry Roberts in diesem Kommentar-Thread finden!)

Der Trick beim Schreiben über Spezifität ist die Verwendung von Kommas, damit es nicht wie eine einzelne Zahl aussieht. 0122 wird besser als 0, 1, 2, 2 dargestellt. Die Diagramme in nachfolgenden aktualisierten Beiträgen waren besser

Die erste Ziffer repräsentiert, ob ein Element einen Inline-Stil hat oder nicht, also ist das wirklich nur eine 0 oder eine 1, aber der Rest ist theoretisch unendlich. Ich schätze, es wäre so

[0 or 1], ∞, ∞, ∞

Eine Zahl in einer höheren Spalte kann jede Zahl darunter schlagen. 0, 1, 0, 0 schlägt 0, 0, 312, 54659392. Das allein ist der Grund, warum es so beliebt ist, nie IDs zu verwenden und die Spezifität flach zu halten.