Pseudo-elemento ::after
O pseudo-elemento ::after é utilizado para adicionar conteúdo adicional após o conteúdo real de um elemento. Ele é frequentemente utilizado para inserir elementos decorativos ou ícones sem a necessidade de adicionar elementos extra no HTML.
Exemplo
Considere o seguinte trecho de código HTML com um parágrafo:
<p>Este é um parágrafo de exemplo.</p>O código CSS abaixo adicionará conteúdo após o parágrafo:
p::after {
content: " - Fim do parágrafo";
color: gray;
}
Neste exemplo, após o conteúdo do parágrafo, será adicionado o texto ” - Fim do parágrafo” em cinza.