Simple CSS Counter

Here is an example for the simple CSS Counter. By this we can count and append the serial number for the element.

by Satheesh Kumar

HTML

<div>
 <p>Line</p>
 <p>Line</p>
 <p>Line</p>
</div>

 <p class="note">
 Second div Element (count starts from 1, because we used counter-reset for the div)
 </p>
 
<div>
 <p>Line</p>
 <p>Line</p>
 <p>Line</p>
</div>

CSS

div {
	counter-reset: plus;
}
div p::after {
	counter-increment: plus;
	content:" " counter(plus);
}
p.note {
	color: red;
}