*:after, *::before? Qual a diferença?

[reebr 94]

Antes, minha dúvida não é sobre o uso de 'after' e 'before'!

 

http://tympanus.net/codrops/2013/07/30/google-nexus-website-menu/

 

Estava lendo o tutorial acima e logo no inicio encontrei algo diferente (para mim).

Neste trecho:

*,
*:after,
*::before {
    box-sizing: border-box;
}

Qual a diferença entre " : " e " :: " ?

Foi um erro de quem escreveu o tutorial ou realmente é necessário usar duas vezes os dois pontos depois do seletor universal?

[samoelyeshua 15]

Dá uma olhada aqui, acho é o que você procura
https://developer.mozilla.org/en-US/docs/Web/CSS/::before

[reebr 94]

" : " é do css2 e " :: " do css3, é isso?

[Nícolas Luís Huber 14]

rnxn, a diferença é essa mesmo. Acontece que existe muita confusão entre o que é pseudo-elements e pseudo-classes, na tentativa de retirar está dúvida a sintaxe CSS3 inclui :: para pseudo-elements e : para pseudo-class.

 

 

Sometimes you will see double colons ("::") instead of just one (":"). This is part of CSS3 and an attempt to distinguish between pseudo-classes and pseudo-elements. Most browsers support both values.

https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-elements