CSS Counters mirip seperti "variabel" di CSS. Nilai variabel ini dapat ditambah (di-increment) oleh aturan CSS untuk melacak berapa kali elemen digunakan.
CSS Counters
Penomoran Bab Otomatis dengan CSS Counter:
<!DOCTYPE html>
<html>
<head>
<style>
body { counter-reset: bab-nomor; font-family: sans-serif; }
h3::before {
counter-increment: bab-nomor;
content: "Bab " counter(bab-nomor) ": ";
color: #04AA6D;
}
</style>
</head>
<body>
<h3>Pengenalan CSS</h3>
<h3>Sintaks & Selector</h3>
<h3>Tata Letak Flexbox</h3>
</body>
</html>Browser secara otomatis memberi label 'Bab 1:', 'Bab 2:', 'Bab 3:' di depan setiap tag h3!