CSS/Eigenschaften/generierter Inhalt/Nummerierung/counter-reset

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche

Mit der Eigenschaft counter-reset können Sie Zähler starten oder zurücksetzen. Diese Zähler können dann z.B. fortlaufende Kapitelnummerierungen erzeugen.

  • Chrome
  • Firefox
  • IE 8
  • Opera
  • Safari
Beispiel ansehen …
    body {
      counter-reset: section;
    }
 
    h2 {
      counter-reset: subsection;
    }
 
    h2::before {
      counter-increment: section;
      content: "Band " counter(section) " - ";
      color: red;
    }
 
    h3::before {
      counter-increment: subsection;
      content: counter(section) "." counter(subsection) ": ";
      color: green;
    }

Folgende Angaben sind möglich:

  • none: (Standardwert) Keiner der Zähler wird verändert.
  • Name: Der Name des Zählers, der zurückgesetzt, bzw. gestartet werden soll.
  • Nummer: Der Wert, auf den der Zähler zurückgesetzt werden soll. Falls nicht angegeben, wird 0 verwendet.
  • initial: wird auf Standardwert zurückgesetzt
  • inherit: Einstellungen werden vom Elternelement übernommen
Meine Werkzeuge
Namensräume

Varianten
Aktionen
Übersicht
Index
Mitmachen
Werkzeuge
Spenden
SELFHTML