Beställda listor är inte de enda elementen som kan numreras automatiskt. Tack vare de olika motrelaterade egenskaperna kan alla element vara.
body ( counter-reset: my-awesome-counter; ) section ( counter-increment: my-awesome-counter; ) section:before ( content: counter(my-awesome-counter); )Var och en börjar med “1”, “2”, “3” eller “4”.
Du kan styra räknarens stil genom att separera räknarfunktionen med kommatecken. t.ex. för att få dem att använda romerska siffror:
section:before ( content: counter(my-awesome-counter, upper-roman); )Demo
På CodePen:
Mer information
- CSS3 specifikation
- MDN-dokument
Webbläsarstöd
| Krom | Safari | Firefox | Opera | IE | Android | iOS |
|---|---|---|---|---|---|---|
| 2+ | 3.1+ | Några | 9.2+ | 8+ | TBD | TBD |