Gerador de Contadores CSS Gere contadores CSS para listas numeradas personalizadas com vários estilos e níveis de nestagem.

Os contadores CSS usam três propriedades principais: counter-reset inicializa um contador em um elemento pai, counter-increment aumenta o contador nos elementos filhos e counter() ou counters() na propriedade content exibe o valor. A propriedade counter-reset cria uma nova instância de contador: counter-reset: seção. O counter-increment avança: counter-increment: seção. A propriedade content em um pseudo-elemento ::before exibe o contador: content: counter(seção). A função counter() aceita um argumento de estilo opcional: counter(seção, upper-roman). Para contadores aninhados, cada nível reinicializa seu próprio sub-contador. A função counters() (note o 's') lida com escopos aninhados: counters(seção, ".") produz a notação "1.2.3". Os tipos de lista disponíveis incluem decimal, decimal-leading-zero, lower-alpha, upper-alpha, lower-roman, upper-roman, lower-greek e mais. Múltiplos contadores podem ser definidos e usados independentemente.