Funkcja licznika CSS ()
Przykład
Utwórz licznik dla strony (w selektorze treści). Zwiększ wartość licznika dla każdego elementu <h2> i dodaj tekst „Przekrój < wartość licznika >:” przed każdym elementem <h2>:
body {
counter-reset: section;
}
h2::before {
counter-increment: section;
content: "Section " counter(section) ": ";
}
Więcej przykładów „Wypróbuj sam” poniżej.
Definicja i użycie
Funkcja counter() zwraca bieżącą wartość nazwanego licznika w postaci ciągu.
Wersja: | CSS3 |
---|
Obsługa przeglądarki
Function | |||||
---|---|---|---|---|---|
counter() | Yes | Yes | Yes | Yes | Yes |
Składnia 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) |
Więcej przykładów
Przykład
Ustaw styl licznika:
body {
counter-reset: section;
}
h2::before {
counter-increment: section;
content: "Section " counter(section,
upper-roman) ": ";
}
Powiązane strony
Odniesienie CSS: właściwość treści
Odniesienie CSS: właściwość licznika przyrostu
Odniesienie CSS: właściwość resetowania licznika