CSS/Eigenschaften/counter-increment

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche

Die Eigenschaft counter-increment ermöglicht es, Elemente mit Hilfe von CSS-Zählern durchzunummerieren. So sind z.B. fortlaufende Kapitelnummerierungen möglich.

Erlaubte Werte

Auflistung von Inkrement-Angaben, durch Leerstellen getrennt. Eine Inkrement-Angabe besteht aus

  • user-ident: Name des Zählers, der erhöht werden soll.
  • Zahl: optional der Wert, um die erhöht werden soll. Wird er weggelassen, erhöht sich der Counter um 1

An Stelle der Auflistung können Sie auch dies setzen:

  • none: es wird nicht gezählt. Diese Angabe ist nützlich, wenn für ein Element counter-increment durch eine allgemeinere CSS-Regel gesetzt wird, aber im spezifischen Fall nicht inkrementiert werden soll.
Vererbung steuernde Werte inherit, initial, unset und revert
Standardwert

none

anwendbar auf

alle Elemente
(Inkrementieren geht überall - der Counter selbst kann nicht überall eingesetzt werden)

Vererbung

nein

animierbar

nein

Beispiel
h1 {
  counter-increment: Kapitel;
}
li.apfel {
  counter-increment: Obst Apfel;
}
Die erste Regel erhöht den Wert von Kapitel um 1. Die zweite Regel inkrementiert die Zähler für Apfel und Obst - weil Äpfel Obst sind, bedeutet ein Apfel mehr, dass es auch ein Stück Obst mehr gibt.

Siehe auch

Weblinks