Ceci est une ancienne révision du document !
Table des matières
Numérotation automatique avec des compteurs CSS
Pour la rédaction de documents, il est souvent utile de numéroter les sections et d'avoir une table des matières.
Le protocole CSS 2.1 automatise la génération de numéros à l'aide de compteurs CSS, et cet article vous guidera dans leur utilisation.
Pré-requis
Première étape
La première étape consiste à réinitialiser le compteur et à le nommer.
Pour cela, on peut utiliser la propriété counter-reset, comme dans l'exemple suivant :
body {
counter-reset:section;
}
Le compteur est remis à zéro pour l'élément <body>, et le compteur a pour identifiant «section». Ce nom est à votre convenance.
La propriété peut également prendre une deuxième valeur optionnelle qui définit la valeur de départ du compteur.
Voici comment faire pour que le compteur commence à compter à partir de 5 :
body {
counter-reset:section 4;
}
Cette valeur est fixée à 4 car le compteur est toujours incrémenté juste avant de l'afficher. Si vous le mettez à 4, la valeur passe à 5 avant l'affichage.
