CSS counter-increment Property

by Pritesh Patel

HTML

<h1>HTML and CSS</h1>
<h2>HTML Tutorial</h2>
<h2>CSS Tutorial</h2>
<h2>Bootstrap Tutorial</h2>
<hr>

<h1>JavaScript</h1>
<h2>JavaScript Tutorial</h2>
<h2>jQuery Tutorial</h2>
<h2>JSON Tutorial</h2>
<hr>

<h1>Server Side</h1>
<h2>SQL Tutorial</h2>
<h2>PHP Tutorial</h2>

CSS

body {
    /* Set "section" to 0 */
    counter-reset: section;
}

h1 {
    /* Set "subsection" to 0 */
    counter-reset: subsection;
}

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

h2::before {
    counter-increment: subsection;
    content: counter(section) "." counter(subsection) ") ";
}
h1 ~ h2 {
font-weight: normal}