Ejemplo
Una manera de numerar las secciones y subsecciones con "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) " ";
}
Inténtalo tú mismo " Definición y Uso
La propiedad counter-reset crea o pone a cero uno o más contadores.
La propiedad counter-reset se utiliza generalmente junto con la propiedad de la lucha contra el incremento y la propiedad de contenido.
| Valor por defecto: | none |
|---|---|
| Heredado: | no |
| animatable: | no. Read about animatable |
| Versión: | CSS2 |
| la sintaxis de JavaScript: | object .style.counterReset="section" Try it |
Soporte para el navegador
Los números de la tabla especifican la primera versión del navegador que es totalmente compatible con la propiedad.
| Propiedad | |||||
|---|---|---|---|---|---|
| counter-reset | 4.0 | 8.0 | 2.0 | 3.1 | 9.6 |
Note: IE8 es compatible con la propiedad counter-reset sólo si se especifica un! DOCTYPE.
sintaxis CSS
counter-reset: none|name number|initial|inherit;Valores de propiedad
| Valor | Descripción |
|---|---|
| none | Valor por defecto. No se repondrán los contadores |
| name | El name define qué contador que se deben restablecer |
| number | La id define qué contador que se deben restablecer. El number establece el valor del contador se pone a la disponibilidad para cada aparición del selector. El valor de reajuste por defecto es 0 |
| initial | Establece esta propiedad a su valor por defecto. Lea acerca inicial |
| inherit | Hereda esta propiedad de su elemento padre. Lee sobre heredar |
Páginas relacionadas
Referencia CSS: : antes de pseudo elemento
Referencia CSS: : después de pseudo elemento
Referencia CSS: content property
Referencia CSS: counter-increment property
Referencia HTML DOM: counterReset property