Je viens de voir un code CSS qui incluait ::before tag. J'ai regardé MDN pour voir ce que le ::before mais je ne l'ai pas vraiment compris.
Quelqu'un peut-il expliquer comment cela fonctionne ?
Est-ce que cela fait un élément DOM avant ce que nous sélectionnons par CSS ?
D'après ces documents, ils sont équivalents :
element:before { style properties } /* CSS2 syntax */
element::before { style properties } /* CSS3 syntax */La seule différence est que le double point est utilisé en CSS3, alors que le simple point est la version traditionnelle.
Raisonnement :
La notation ::before a été introduite dans CSS 3 afin d'établir une discrimination entre les pseudo-classes et les pseudo-éléments. Les navigateurs acceptent également la notation :before introduite en CSS 2.
Cela permet de distinguer les pseudo-éléments des pseudo-classes.
La différence entre les pseudo-classes et les pseudo-éléments est décrite à l'adresse suivante http://www.d.umn.edu/~lcarlson/csswork/selectors/pseudo_dif.html
La notation ::before (avec deux points de suspension) a été introduite dans CSS3 afin d'établir une discrimination entre les pseudo-classes et les pseudo-éléments. Les navigateurs acceptent également la notation :before introduite en CSS 2. Source : developer.mozilla.org/fr/US/docs/Web/CSS/::before Comme il s'agit d'un pseudo-élément et non d'une pseudo-classe (comme :hover), il est préférable de mettre deux points de suspension (conformément à la norme CSS3).
J'ai vérifié MDN y w3.org et le mieux que j'ai pu trouver, c'est que :: est utilisé pour structurelle les changements, et : est utilisé pour stylisme .
Ils sont actuellement interchangeables pour des raisons de compatibilité.
Il semble séparer :link (par exemple), qui stylise un <a> , de :before (qui est un structurelle changement).
: est pour le stylisme, :: est pour la structure.
L'une est la méthode CSS2 (:before) et l'autre la méthode CSS3 (::before). Actuellement, elles sont interchangeables dans les navigateurs qui prennent en charge CSS2 et CSS3.
Voici une bonne explication : http://www.impressivewebs.com/before-after-css3/
Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.
1 votes
Il semble que le groupe de travail CSS ait décidé de préfixer les pseudo-éléments par un deux-points supplémentaire pour les différencier des pseudo-classes qui n'ont qu'un seul deux-points.
5 votes
... et comme la notation par double pointage n'est pas implémentée dans IE8, nous devrons attendre qu'elle soit supprimée du marché (en 2016 environ) avant de pouvoir commencer à utiliser la notation par double pointage.
::before. Bon travail, Microsoft-.-1 votes
Les pseudo-éléments existent depuis CSS1. Les premiers pseudo-éléments étaient
:first-lettery:first-line.