5

Em estudos sobre os seletores CSS, temos visto o seletor :: em alguns momentos. Porém não encontrei referência específica sobre este keyword :: isolado. Ou seja, eu só vi ele sendo aplicado em seletores principalmente relacionado à pseudo-elementos.

Exemplo: T::first-letter

Porém não entendi o que ele significa, e também não entendi se existe algum padrão que identifique uma possibilidade de uso dele.

Podem ajudar a levantar a referência sobre isto?

1 Resposta 1

10

Isso chama-se pseudo-elements e estão disponíveis na maior parte dos browsers.

Os seletores de CSS normalmente referem-se a elementos do DOM, este pseudo seletor :: refere-se a elementos que não estão diferênciados no DOM. Pode ser a primeira letra por exemplo:

::first-letter {
  color: blue;
}
<p>Algum texto!</p>

ou a primeira linha:

::first-line {
  color: blue;
}
<p>Algum texto!<br>e a continuação</p>

ou acrescentando texto que não existe no DOM:

p::before {
  content: 'Nota: ';
  color: red;
}
<p>Algum texto!</p>

A lista é:

::after
::before
::first-letter
::first-line
::selection
::backdrop 
::placeholder 
::marker 
::spelling-error 
::grammar-error 
2
  • Sergio, e estes se aplicam somente no <p> ou em outras tags também? Commented 3/05/2017 às 0:39
  • @BrunoHeringer não é especifico do <p>, funciona com outras tags também.
    – Sergio
    Commented 3/05/2017 às 4:58

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .