Exemplo
Uma maneira de numerar seções e sub-seções com "Section 1" , "1.1" , "1.2" , etc .:
body
{
counter-reset: section;
}
h1
{
counter-reset: subsection;
}
h1:before
{
counter-increment: section;
content: "Section " counter(section) ". ";
}
h2:before
{
counter-increment: subsection;
content: counter(section) "." counter(subsection) " ";
}
Tente você mesmo " Definição e Uso
A propriedade counter-reset cria ou redefine um ou mais contadores.
A propriedade counter-reset é geralmente usado em conjunto com a propriedade anti-incremento e a propriedade de conteúdo.
| Valor padrão: | none |
|---|---|
| Herdado: | no |
| Animatable: | no. Read about animatable |
| Versão: | CSS2 |
| sintaxe JavaScript: | object .style.counterReset="section" Try it |
Suporte a navegadores
Os números na tabela especificar a primeira versão do browser que suporta totalmente a propriedade.
| Propriedade | |||||
|---|---|---|---|---|---|
| counter-reset | 4.0 | 8 | 2.0 | 3.1 | 9,6 |
Note: IE8 suporta a propriedade counter-reset somente se um DOCTYPE é especificado!.
CSS Syntax
counter-reset: none|name number|initial|inherit;Valores de propriedade
| Valor | Descrição |
|---|---|
| none | Valor padrão. Nenhum contador será reposto |
| name | O name define quais contador que deve ser reposto |
| number | O id define quais contador que deve ser reposto. O number define o valor do contador é definido como em cada ocorrência do selector. O valor de reposição padrão é 0 |
| initial | Define essa propriedade para o valor padrão. Leia sobre inicial |
| inherit | Herda essa propriedade do seu elemento pai. Leia sobre herdar |
Páginas relacionadas
Referência CSS: : antes elemento pseudo
Referência CSS: : após elemento pseudo
Referência CSS: content property
Referência CSS: counter-increment property
HTML DOM de referência: counterReset property