Contadores automáticos é uma feature disponível desde da versão 2.1 do CSS. Com ela é possível adicionar índices numéricos a qualquer tag.

A técnica consiste em atribuir um contador ou uma string concatenada á propriedade content em um dos pseudo-elementos :before ou :after. O contador é incrementado de acordo com as ocorrências de um elemento.

Isso é possível graças as propriedades counter-reset e counter-increment.

1
2
3
4
5
6
7
8
9
10

section {
  /* counter-reset cria um escopo, por padrão o valor é 0 */
  counter-reset: capitulo
}

h1:before{
  content: "Capítulo " counter(capitulo) ". ";
  /* Incrementa +1 para cada ocorrência do elemento */
  counter-increment: capitulo
}

Exemplo de numeração customizada em listas:

Exemplo de numeração automática em parágrafos:

Exemplo de numeração automática com herança:

Essa técnica funciona para qualquer tipo de listagem ou sequência de tags, seja uma sequência de <p> ou até mesmo de <div>, pois as propriedades counter-reset e counter-increment são globais.

A questão compatibilidade já está bem resolvida, por ser uma feature antiga está disponível para a maioria dos browsers. Can I Use CSS Counters.