counter-increment

(Auszug aus "CSS − Anspruchsvolle Websites mit Cascading Stylesheets" von Rachel Andrew & Dan Shafer)

Die Eigenschaft counter-increment beschreibt, bei welchem Element ein Zähler aktiv wird und um wie viel er pro Element erhöht werden soll.

Bei verschachtelten Elementen wird automatisch ein hierarchischer Zähler erzeugt; es gibt somit einen separaten Zähler auf jeder Gliederungsebene.

Vererbt: nein

Siehe auch: content, counter-reset

Werte

Ein Zählername, optional gefolgt von einer positiven oder negativen ganzen Zahl. Die ganze Zahl gibt den Betrag an, um den der Zähler erhöht (positiver Wert) oder verringert (negativer Wert) werden soll, wenn er auf das betreffende Element trifft. Wenn mehrere Zähler eines einzigen Elements definiert werden sollen, werden die Namen der Zähler (und deren optionalen Beträge) mit Leerzeichen getrennt angegeben. Der Standardwert none wird ebenfalls unterstützt, hat aber keinen praktischen Nutzen.

Standardwert: none

Kompatibilität

CSS-Version: 2

Wird von keinem aktuellen Browser unterstützt.

Beispiele

Folgende Stilregel zählt die <h1>-Tags in dem Dokument und zeigt automatisch eine Kapitelnummer am Anfang jeder Überschrift erster Ordnung an:

h1 {
 counter-increment: chapter;
}
h1:before {
 content: "Kapitel " counter(chapter) " - ";
}

Folgende Stilregeln setzen einen Zähler für alle div-Elemente ein und blenden dessen Wert in den begleitenden Überschriften ein. Die Ausgabe des Zählers geschieht nach dem Format counters(), somit werden verschachtelte div-Elemente hierarchisch durchnummeriert.

div {
 counter-increment: division;
}
div > h1:before {
 content: "Abschnitt " counters(division,".") ": ";
}

  

<< zurück vor >>

 

 

 

Tipp der data2type-Redaktion:
Zum Thema CSS bieten wir auch folgende Schulungen zur Vertiefung und professionellen Fortbildung an:

Copyright © 2006 der deutschen Übersetzung dpunkt.verlag GmbH
Für Ihren privaten Gebrauch dürfen Sie die Online-Version ausdrucken.
Ansonsten unterliegt dieses Kapitel aus dem Buch "CSS − Anspruchsvolle Websites mit Cascading Stylesheets" denselben Bestimmungen, wie die gebundene Ausgabe: Das Werk einschließlich aller seiner Teile ist urheberrechtlich geschützt. Alle Rechte vorbehalten einschließlich der Vervielfältigung, Übersetzung, Mikroverfilmung sowie Einspeicherung und Verarbeitung in elektronischen Systemen.

dpunkt.verlag GmbH, Ringstraße 19, 69115 Heidelberg