A rendezett listák nem az egyetlen elemek, amelyek automatikusan számozhatók. A különféle számlálóval kapcsolatos tulajdonságoknak köszönhetően bármely elem lehet.
body ( counter-reset: my-awesome-counter; ) section ( counter-increment: my-awesome-counter; ) section:before ( content: counter(my-awesome-counter); )
Mindegyik „1”, „2”, „3” vagy „4” betűvel kezdődik.
A számláló stílusát úgy állíthatja be, hogy vesszővel elválasztja a számláló funkciót. pl. római számok használatára:
section:before ( content: counter(my-awesome-counter, upper-roman); )
Demó
A CodePen-en:
Több információ
- CSS3 specifikáció
- MDN dokumentumok
Böngésző támogatás
Króm | Szafari | Firefox | Opera | AZAZ | Android | iOS |
---|---|---|---|---|---|---|
2+ | 3.1+ | Bármi | 9.2+ | 8+ | TBD | TBD |