Definición de .counter-increment utilizado en CSS
Las listas ordenadas no son los únicos elementos que se pueden numerar automáticamente. Gracias a las diversas propiedades relacionadas con el contrato, cualquier elemento puede ser.
Caso de empleo : propiedad CSS counter-increment
Si quieres utilizar esta propiedad de CSS en tu stylesheet, hazlo de la siguiente forma:
<body>
<section></section>
<section></section>
<section></section>
<section></section>
</body>Otro ejemplo más avanzado de .counter-increment es el siguiente de CODEPEN:
Sintaxis de .counter-increment en CSS
counter-increment: none|id|initial|inherit;Valores
| Valor | Descripción |
|---|---|
| ninguna | Valor por defecto. No se incrementarán los contadores |
| número de identificación | El id define qué contador incrementar. El número establece cuánto se incrementará el contador en cada aparición del selector. El incremento predeterminado es 1. Se permiten valores negativos. Si id se refiere a un contador que no ha sido inicializado por counter-reset, el valor inicial predeterminado es 0 |
| inicial | Establece esta propiedad en su valor predeterminado. |
| heredar | Hereda esta propiedad de su elemento principal. |
Exploradores compatibles con .counter-increment
Los números de la tabla detallan la primera versión del navegador que es completamente compatible con la propiedad.
Los números seguidos de -webkit- detallan la primera versión que funcionó con un prefijo.
| Property | Chrome | Internet Explorer / Edge | Firefox | Safari | Opera |
|---|---|---|---|---|---|
| counter-reset | 4.0 | 8.0 | 2.0 | 3.1 | 9.6 |
