Pseudo-elementos

Resumo

Assim como pseudo-classes, pseudo-elementos são adicionados aos seletores mas em vez de descrever um estado especial, eles permitem que você aplique estilos em certas partes de um documento. Por exemplo, o pseudo-elemento ::first-line aplica o estilo apenas na primeira linha do elemento especificado pele seletor.

Sintaxe

seletor::pseudo-elemento {
  propriedade: valor;
}

Todos os pseudo-elementos

• ::after
• ::before
• ::first-letter
• ::first-line
• ::selection
• ::backdrop

Notas

As vezes você vai ver dois pontos aplicados duas vezes (::) em vez de apenas uma (:). Isso faz parte do CSS3 é uma tentativa de diferenciar pseudo-classes de pseudo-elementos. A maioria dos navegadores suportam os dois valores.

Você pode utilizar apenas um pseudo-elemento em um seletor. Ele deve aparecer depois de uma afirmação de um elemento simples.