: après vs :: après
Existe-t-il une différence fonctionnelle entre le CSS 2.1 :after et le CSS 3 ::after pseudo-sélecteurs (autres que ::after non pris en charge par les anciens navigateurs)? Y a-t-il une raison pratique d'utiliser la nouvelle spécification?
C'est la pseudo - classe vs pseudo - distinction d'élément .
À l'exception de _::first-line_, _::first-letter_, _::before_ et _::after_ (qui existent depuis peu de temps et peuvent être utilisés avec des deux-points si vous avez besoin du support IE8), pseudo- éléments requis deux-points.
Les pseudo-classes sélectionnent les éléments réels eux-mêmes, vous pouvez utiliser _:first-child_ ou :nth-of-type(n) pour sélectionner le premier ou spécifique _<p>_ est dans un div, par exemple.
(Et également des états d'éléments réels tels que _:hover_ et _:focus_.)
Les pseudo-éléments ciblent une sous-partie d'un élément comme _::first-line_ ou _::first-letter_, des choses qui ne sont pas des éléments dans leur propre droit.
En fait, une meilleure description ici: http://bricss.net/post/10768584657/know-your-lingo-pseudo-class-vs-pseudo-element
Également ici: http://www.evotech.net/blog/2007/05/after-v-after-what-is-double-colon-notation/
Les sélecteurs CSS comme ::after Sont des éléments virtuels non disponibles comme élément explicite dans l'arborescence DOM. Ils sont appelés "pseudo-éléments" et sont utilisés pour insérer du contenu avant/après un élément (par exemple: ::before, ::after) ou, sélectionnez une partie d'un élément (par exemple: ::first-letter). Actuellement, il n'y a que 5 pseudo-éléments standard: after, before, first-letter, first-line, selection.
D'autre part, il existe d'autres types de sélecteurs appelés "Pseudo-Classes" qui sont utilisés pour définir un état spécial d'un élément (comme :hover, :focus, :nth-child(n)). Ceux-ci sélectionneront l'ensemble d'un élément existant dans DOM. Les pseudo-classes sont une longue liste de plus de 30 éléments.
Initialement (en CSS2 et CSS1), la syntaxe à deux points était utilisée à la fois pour les pseudo-classes et les pseudo-éléments. Mais, dans CSS3, la syntaxe :: A remplacé la notation : Pour les pseudo-éléments afin de mieux les distinguer.
Pour des raisons de compatibilité descendante, l'ancienne syntaxe à deux points est acceptable pour les pseudo-éléments tels que :after (Les navigateurs prennent toujours en charge l'ancienne syntaxe avec un point-virgule). Seul IE-8 ne prend pas en charge la nouvelle syntaxe (utilisez le signe deux-points si vous souhaitez prendre en charge IE8).