Pseudo-elementos

Usado para adicionar elementos extras na página

Identificado por ::palavra-chave


Pseudo-elemento - ::first-letter

Seleciona a primeira letra da primeira linha

Propriedades disponíveis:


Pseudo-elemento - ::first-line

Seleciona a primeira linha

Propriedades disponíveis:

Lorem ipsum dolor sit amet consectetur adipisicing elit. Accusamus ut maxime id nostrum nisi exercitationem quos unde eveniet! Voluptates cum excepturi saepe esse. Possimus, molestias non at repellat nostrum dicta.


Pseudo-elemento - ::marker

Estiliza os topicos ou números do marcador de uma lista.

Propriedades aceitas:

Pseudo-elemento - ::placeholder

Coloca uma dica para ajudar no preenchimento de um campo de formulário

Propriedades aceitas:

Exemplo:


Pseudo-elemento - ::selection

Estiliza o texto selecionado pelo usuário

Propriedades aceitas:

Exemplo:

Lorem ipsum dolor sit amet consectetur adipisicing elit. Accusamus ut maxime id nostrum nisi exercitationem quos unde eveniet! Voluptates cum excepturi saepe esse. Possimus, molestias non at repellat nostrum dicta.

Lorem ipsum dolor sit amet consectetur adipisicing elit. Accusamus ut maxime id nostrum nisi exercitationem quos unde eveniet! Voluptates cum excepturi saepe esse. Possimus, molestias non at repellat nostrum dicta.


Pseudo-elemento - ::backdrop

Estiliza o plano de fundo de um elemento em modo fullscreen


Pseudo-elemento - ::file-selector-button

Estiliza o botão de seleção de arquivo



Card image com Pseudo-elemento ::before

Estiliza elementos na div