Stil mit {stil}

Dez 2007

CSS counter-increment • Name und Schrittweite von Zählern festlegen

counter-increment ist eine Liste aus Paaren von identifier und number für einen Selektor gehören, die als Zähler für einen Selektor definiert werden. identifier ist der Name, number die Schrittweite des Zählers.

Jedes Paar setzt den numerischen Wert fest, durch den der Zähler mit jedem Vorkommen des Selektors erhöht wird. Wenn number nicht angegeben ist, wird der Zähler automatisch um 1 erhöht.

Wenn die display-Eigenschaft des Elements none ist, wird der Zähler nie erhöht. Wenn die visibility-Eigenschaft des Elements hidden ist, kann der Zähler erhöht werden.

Auf diese Weise können z.B. aufeinander folgende Textpassagen oder Bilder durchnummeriert werden.

Beispiel: Kapitel mit counter-increment nummerieren

Jedem h6-Element wird der String »Kapitel« vorangesetzt (in Rot) und ein Zähler »kapnum« um 2 heraufgezählt. Den Überschriften sollten also Kapitelnummern 2, 4, 6 … vorausgehen.

h6:before { content: "Kapitel " counter(kapnum) " • "; color: red; } 

                            +--------- identifier
                            |   +----- number
                            |   |
                            v   v
h6  { counter-increment: kapnum 2; } 

Background - Eigenschaften für den Hintergrund

Stile für die Gestaltung des Hintergrunds von Elementen

Border - Eigenschaften für den Rahmen

Stile für die Gestaltung eines Rahmens um ein Element

Dimension

Stile für die Abmessungen und Ausrichtung von Elementen

Nur echt mit roten Kapitelnummern – Wenn die Kapitelüberschriften mit 2,4, 6 durchnummeriert sind und der Text »Kapitel« die Überschrift einleitet, unterstützt der Browser die CSS-Eigenschaft counter-increment.

Zurzeit implementiert Internet Explorer diese Eigenschaft nicht, so dass die Benutzung dieses Stils auf spezielle Anwendungen begrenzt sein wird.

counter-increment

FF2 O5+ S3 Erblich: Nein CSS2

counter-increment

Liste aus Paaren von identifier und number

Werte

[ <identifier> <integer>? ]+ | none | inherit

none

ist die Voreinstellung und verhindert das Hochzählen des Zählers.

identifier integer

Der Identifier-Teil des Wertepaares ist zwingend erforderlich, denn er identifiziert den Zähler und kann sich auf eine Klasse, einen Identifier oder Selektor beziehen. Der Zahlenwert integer des Wertepaares ist optional und kann negative oder positive Werte annehmen. Wenn er nicht angegeben ist, wird der Zähler per Vorgabe um "1" erhöht.

zurück zum Seitenanfang