Funkce CSS counter() .
Příklad
Vytvořte počítadlo pro stránku (v selektoru těla). Zvyšte hodnotu čítače pro každý prvek <h2> a před každý prvek <h2> přidejte text „Sekce < hodnota čítače >:“:
body {
counter-reset: section;
}
h2::before {
counter-increment: section;
content: "Section " counter(section) ": ";
}
Další příklady „Vyzkoušejte si to sami“ níže.
Definice a použití
Funkce counter() vrací aktuální hodnotu pojmenovaného čítače jako řetězec.
Verze: | CSS3 |
---|
Podpora prohlížeče
Function | |||||
---|---|---|---|---|---|
counter() | Yes | Yes | Yes | Yes | Yes |
Syntaxe CSS
counter(countername,
counterstyle)
Value | Description |
---|---|
countername | Required. The name of the counter (which is the same name used for the counter-reset and counter-increment properties) |
counterstyle | Optional. The style of the counter (can be a list-style-type value) |
Další příklady
Příklad
Nastavte styl počítadla:
body {
counter-reset: section;
}
h2::before {
counter-increment: section;
content: "Section " counter(section,
upper-roman) ": ";
}
Související stránky
CSS reference: vlastnost obsahu
CSS reference: vlastnost counter-increment
CSS reference: vlastnost counter-reset