Posted By

ngocviet on 11/19/14

Tagged

css
html

Versions (?)

Last Edited at 11/19/14 01:40pm

Statistics

Viewed 962 times

Favorited by 0 user(s)

Related snippets

CSS counter styling

/ Published in: CSS

two properties:
* counter-reset
* counter-increment
This example shows a way to number chapters and sections with "Chapter 1", "1.1", "1.2", etc.

Expand | Embed | Plain Text

Copy this code and paste it in your HTML

body {
    counter-reset: chapter;      /* Create a chapter counter scope */
}
h1:before {
    content: "Chapter " counter(chapter) ". ";
    counter-increment: chapter;  /* Add 1 to chapter */
}
h1 {
    counter-reset: section;      /* Set section to 0 */
}
h2:before {
    content: counter(chapter) "." counter(section) " ";
    counter-increment: section;
}