CSS counter-reset-Eigenschaft

Definition und Verwendung

Die Eigenschaft counter-reset setzt den Wert des Zählers für die Anzahl der Auftretens eines bestimmten Selektors. Der Standardwert ist 0.

Mit dieser Eigenschaft kann der Zähler auf jeden Wert gesetzt oder zurückgesetzt werden, sei es positiv oder negativ. Wird keine number angegeben, ist der Standardwert 0.

Anmerkung:Wenn "display: none" verwendet wird, kann der Zähler nicht zurückgesetzt werden. Wenn "visibility: hidden" verwendet wird, kann der Zähler zurückgesetzt werden.

Siehe auch:

CSS Referenzhandbuch:CSS :before Pseudo-Element

CSS Referenzhandbuch:CSS :after Pseudo-Element

CSS Referenzhandbuch:content Eigenschaft

CSS Referenzhandbuch:counter-increment Eigenschaft

CSS Funktion:counter() Funktion

HTML DOM Referenzhandbuch:counterReset-Eigenschaft

Beispiel

Methode zur Nummerierung von Abschnitten und Unterabschnitten (z.B. "Section 1", "1.1", "1.2"):

body
  {
  counter-reset:section;
  }
h1
  {
  counter-reset:subsection;
  }
h1:before
  {
  content:"Section " counter(section) ". ";
  counter-increment:section;
  }
h2:before
  {
  counter-increment:subsection;
  content:counter(section) "." counter(subsection) ";
  }

Versuchen Sie es selbst

CSS-Syntax

counter-reset: none|Name number|initial|inherit;

Eigenschaftswert

Wert Beschreibung
keine Standard. Es kann der Zähler des Selektors nicht zurückgesetzt werden.
id number

id Definiert den Selektor, id oder class, um den Zähler zurückzusetzen.

number Der Wert des Zählers, der die Anzahl der Auftretens des Selektors angibt, kann eine positive, null oder negative Zahl sein.

inherit Die counter-reset-Eigenschaft sollte von der übergeordneten Elemente vererbt werden.

Technische Details

Standardwert: keine
Vererbbarkeit: nein
Version: CSS2
JavaScript-Syntax: object.style.counterReset="subsection"

Browser-Unterstützung

Die Zahlen in der Tabelle geben die erste Browser-Version an, die die Eigenschaft vollständig unterstützt.

Chrome IE / Edge Firefox Safari Opera
4.0 8.0 2.0 3.1 9.6

Anmerkung:Wenn !DOCTYPE bereits definiert ist, unterstützt Internet Explorer 8 (und höher) die counter-reset-Eigenschaft.