La numérotation automatique sous CSS2 est contrôlé par deux propriétés, le compteur d'incrémentation et le ré-initialisateur de compteur.

Ces compteurs permettent la numérotation automatique par exemple.

La propriété "counter-increment" accepte uns ou plusieurs noms de compteur (les identificateurs), chacun facultativement suivi par un entier. L'entier indique par combien le compteur est incrémenté pour chaque occurrence de l'élément. L'incrément de défaut est 1. On permet le zéro et des entiers négatifs.

La propriété "counter-reset" contient aussi une liste d'uns ou plusieurs noms de compteur, chacun facultativement suivi par un entier. Le nombre entier donne la valeur que le compteur prend à chaque occurrence de l'élément. La valeur par défaut est 0.

Si le "counter-increment" se réfère à un compteur qui n'est pas dans la portée de n'importe quel "counter-reset", le compteur est supposé avoir été remis à 0 par l'élément racine.

Dans cet exemple, les chapitres sont numérotées au niveau des chapitres (1, 2, 3, etc.) et des sections (1.1, 1.2, etc.).

h1:before {
  content: "Chapitre " counter(châpitre) ". ";counter-increment: Chapitre;
  /* Ajoute 1 au Chapitre */
  counter-reset: Section;
  /* Réinitialise la section à 0 */
}

h2:before {
  content: counter(Chapitre) "." counter(Section) " ";
  counter-increment: Section;
}

 Exemple