Join MDN and developers like you at Mozilla's View Source conference, 12-14 September in Berlin, Germany. Learn more at https://viewsourceconf.org

counter-reset

Übersicht

Die counter-reset CSS Eigenschaft wird verwendet, um CSS Zähler auf einen bestimmten Wert zurückzusetzen.

Initialwertnone
Anwendbar aufalle Elemente
VererbtNein
Medienalle
Berechneter Wertwie angegeben
AnimierbarNein
Kanonische Reihenfolgedie eindeutige Reihenfolge definiert durch die formale Grammatik

Syntax

/* Setzt 'counter-name' auf 0 */
counter-reset: counter-name;

/* Setzt 'counter-name' auf -1 */
counter-reset: counter-name -1;

/* Setzt 'counter1' auf 1 und 'counter2' auf 4 */
counter-reset: counter1 1 counter2 4;

/* Bricht alle Rücksetzungen ab, die in weniger spezifischen Regeln gesetzt würden */
counter-reset: none;

/* Globale Werte */
counter-reset: inherit;
counter-reset: initial;
counter-reset: unset;

Werte

<custom-ident>
Der Name des Zählers, der zurückgesetzt werden soll. Dieser Bezeichner besteht aus einer Kombination von den schreibungsunabhängigen Buchstaben a bis z, den Zahlen 0 bis 9, Unterstrichen (_), und/oder Bindestrichen (-). Das erste Zeichen, das kein Bindestrich ist, muss ein Buchstabe sein (d. h. am Anfang darf keine Zahl stehen, auch nicht, wenn davor ein Bindestrich steht). Zudem sind zwei Bindestriche am Anfang des Bezeichners verboten. Er darf weder none, unset, initial oder inherit unabhängig von Groß- und Kleinschreibung sein.
<integer>
Der Wert, auf den der Zähler bei jedem Vorkommen des Elements zurückgesetzt werden soll. Falls nicht angegeben, wird 0 verwendet.
none
Ist ein Schlüsselwort, das angibt, dass keiner der Zähler zurückgesetzt wird. Es kann dazu verwendet werden, um counter-reset Werte zu verstecken, die in weniger spezifischen Regeln definiert wurden.

Es können beliebig viele Zähler zurückgesetzt werden, jeder durch ein Leerzeichen getrennt.

Formale Syntax

[<custom-ident> <integer>?]+ | none

Beispiele

h1 {
  counter-reset: chapter section 1 page;
  /* Setzt den 'chapter' und 'page' Zähler auf 0
     und den 'section' Zähler auf 1. */
}

Spezifikationen

Spezifikation Status Anmerkung
CSS Lists and Counters Module Level 3
Die Definition von 'counter-reset' in dieser Spezifikation.
Arbeitsentwurf Keine Änderung
CSS Level 2 (Revision 1)
Die Definition von 'counter-reset' in dieser Spezifikation.
Empfehlung Ursprüngliche Definition

Browser Kompatibilität

Merkmal Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Grundlegende Unterstützung 2.0 1.0 (?) 8.0 9.2 3.1 (?)
Merkmal Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Grundlegende Unterstützung 2.1 25.0 (?) 10 (?) 10.0 3.2

Siehe auch

Schlagwörter des Dokuments und Mitwirkende

 Mitwirkende an dieser Seite: Sebastianz, fscholz
 Zuletzt aktualisiert von: Sebastianz,