css - word - pseudo elements mdn




: depois vs. (2)

Existe alguma diferença funcional entre os CSS 2.1 :after e os pseudo-seletores do CSS 3 ::after (diferente de ::after não ser suportado em navegadores mais antigos)? Existe alguma razão prática para usar a especificação mais recente?


É a distinção pseudo- classe vs pseudo- elemento .

Exceto para ::first-line , ::first-letter , ::before e ::after (que existem há pouco tempo e podem ser usados ​​com dois-pontos se você precisar de suporte ao IE8), os pseudo- elementos requerem dois-pontos duplos.

As pseudo-classes selecionam os elementos reais, você pode usar :first-child ou :nth-of-type(n) para selecionar o primeiro ou o <p> específico em um div, por exemplo.
(E também estados de elementos reais como :hover e :focus .)

Os pseudo-elementos visam uma sub-parte de um elemento como ::first-line ou ::first-letter , coisas que não são elementos por direito próprio.

Na verdade, melhor descrição aqui: http://bricss.net/post/10768584657/know-your-lingo-pseudo-class-vs-pseudo-element
Também aqui: http://www.evotech.net/blog/2007/05/after-v-after-what-is-double-colon-notation/


Seletores CSS como ::after são alguns elementos virtuais não disponíveis como um elemento explícito na árvore DOM. Eles são chamados de " Pseudo-Elements " e são usados ​​para inserir algum conteúdo antes / depois de um elemento (por exemplo: ::before , ::after ) ou selecionar alguma parte de um elemento (por exemplo: ::first-letter ). Atualmente, existem apenas 5 pseudo-elementos padrão: after, before, first-letter, first-line, selection .

Por outro lado, existem outros tipos de seletores chamados " Pseudo-Classes " que são usados ​​para definir um estado especial de um elemento (como :hover :focus :nth-child(n) ). Estes irão selecionar todo um elemento existente no DOM. Pseudo classes são uma longa lista com mais de 30 itens.

Inicialmente (em CSS2 e CSS1), a sintaxe de ponto-e-vírgula foi usada para pseudo-classes e pseudo-elementos. Mas, em CSS3, a sintaxe :: substituiu a : notação por pseudo-elementos para melhor distinguir deles.

Para compatibilidade com versões anteriores, a antiga sintaxe de vírgula única é aceitável para pseudo-elementos como :after (os navegadores ainda suportam a sintaxe antiga com um ponto-e-vírgula). Apenas o IE-8 não suporta a nova sintaxe (use um ponto-e-vírgula para suportar o IE8).







pseudo-class