joerghuelsermann.de Spezifitäten einer CSS Datei ermitteln

Bitte geben sie eine URL an.

Spezifitäten einer CSS Datei ermitteln

Die Spezifitäten einer CSS Datei ermitteln ist der Sinn der hinter dieser Seite steht.

Zweck der Spezifität

Eine Spezifität stellt eine Gewichtung der CSS Selektoren in Stufen dar, wobei die höchste Stufe dann den Vorrang geniesst.

Berechnung der Spezifität

Aus der angegebenen CSS Datei werden alle Kommentare und auch unnötige Leerzeichen zuerst entfernt. Angaben zu einer Dataurl auf Base64 Basis werden umgewandelt so das sie nur angedeutet werden. Zusätzlich werden CSS @ Regeln entsprechend behandelt.

Anhand der verschiedenen Selektoren in einer CSS werden die Spezifitäten und die Anzahl der Selektoren berechnet. Dabei baut das Prinzip auf vier Stufen auf. Die Stufe A kann in einer CSS Datei nicht vorkommen.

Stufen der Spezifitäten
  • Stufe A: style Attribute
  • Stufe B: Anzahl der id Attribute
  • Sufe C: Anzahl der class Attribute, Attributabhängige Selektoren und Pseudo Klassen
  • Stufe D: Anzahl der Elemente und Pseudo Elemente

In die Berechnung fliessen nur die aufgeführten Pseudo Klassen und Pseudo Elemente mit ein. Quelle und Selektoren Level 4

Pseudo Klassen
  • root
  • nth-child
  • nth-last-child
  • nth-of-type
  • nth-last-of-type
  • first-child
  • last-child
  • first-of-type
  • last-of-type
  • only-child
  • only-of-type
  • empty
  • link
  • visited
  • active
  • hover
  • focus
  • target
  • lang
  • enabled
  • disabled
  • checked
  • not
  • required
  • optional
  • valid
  • invalid
  • any-link
  • local-link
  • scope
  • active-drop-target
  • valid-drop-target
  • invalid-drop-target
  • current
  • past
  • dir
  • indeterminate
  • default
  • in-range
  • out-of-range
  • user-error
  • read-only
  • read-write
  • nth-match
  • nth-last-match
  • nth-column
  • nth-last-column
Pseudo Elemente
  • first-line
  • first-letter
  • before
  • after

Dieses Tool soll unterstützend dahin einwirken, das man in der Lage ist möglichst niedrige Spezifitäten zu definieren und weitere Schwachstellen in der CSS Datei zu finden.