Quelle est la différence entre ':' et '::' en CSS ?

Différence : un deux-points est une pseudo-classe et deux deux-points sont des pseudo-éléments.

(Tutoriel recommandé : Tutoriel CSS)

La pseudo-classe peut attribuer des styles indépendamment des éléments du document, et peut être affectée à n'importe quel élément, logiquement et fonctionnellement . Similaire, mais il est prédéfini, n'existe pas dans l'arborescence du document et est exprimé d'une manière différente, c'est pourquoi on l'appelle une pseudo-classe.

Le contenu contrôlé par un pseudo-élément est le même que le contenu contrôlé par un élément, mais le pseudo-élément n'existe pas dans l'arborescence du document et n'est pas un élément réel, on l'appelle donc un pseudo-élément.

Les pseudo-classes incluent : :first-child, :link:, visitited, :hover:, active:focus, :lang

Les pseudo-éléments incluent : :first-line, :first -letter , :before, :after

La différence entre les pseudo-classes et les pseudo-éléments :

pseudo-classe

Les éléments de sélection de pseudo-classes sont basés sur le courant état de l'élément, ou l'élément Les caractéristiques actuelles, plutôt que des signes statiques tels que l'identifiant, la classe et les attributs de l'élément. Puisque l'état change dynamiquement, lorsqu'un élément atteint un état spécifique, il peut acquérir un style de pseudo-classe ; lorsque l'état change, il perdra ce style ; On peut voir que sa fonction est quelque peu similaire à celle d'une classe, mais elle est basée sur une abstraction en dehors du document, c'est pourquoi on l'appelle une pseudo-classe.

:link

la pseudo-classe sera appliquée aux liens non visités et s'exclut mutuellement avec :visited. La pseudo-classe

:hover

sera appliquée à l'élément survolé par le pointeur de la souris. La pseudo-classe

:active

sera appliquée aux éléments activés, tels que les liens cliqués, les boutons enfoncés, etc. La pseudo-classe

:visited

sera appliquée aux liens qui ont été visités et s'exclut mutuellement avec :link. La pseudo-classe

:focus

sera appliquée aux éléments qui ont le focus de saisie au clavier. La pseudo-classe

:first-child

sera appliquée lorsque l'élément apparaît pour la première fois sur la page. La pseudo-classe

:lang

sera appliquée aux éléments avec la langue spécifiée.

(Recommandation vidéo d'apprentissage : tutoriel vidéo CSS)

Pseudo-élément

Contrairement aux pseudo-classes pour les éléments dans des états spéciaux, les pseudo-éléments sont Il opère sur le contenu spécifique d'un élément à un niveau plus profond que les pseudo-classes, sa nature dynamique est donc bien inférieure à celle des pseudo-classes.

En fait, le but de la conception de pseudo-éléments est de sélectionner la première lettre (lettre) et la première ligne du contenu de l'élément, et de sélectionner le recto ou le verso de certains contenus, ce que les sélecteurs ordinaires ne peuvent pas faire. . Le contenu qu'il contrôle est en fait le même que l'élément, mais il ne s'agit que d'une abstraction basée sur l'élément et n'existe pas dans le document, c'est pourquoi on l'appelle un pseudo-élément. Le style du pseudo-élément

::first-letter

sera appliqué à la première lettre du texte de l'élément. Le style du pseudo-élément

::first-line

sera appliqué à la première ligne du texte de l’élément.

::before

Ajoute un nouveau contenu au début du contenu de l'élément.

::after

Ajoute un nouveau contenu à la fin du contenu de l'élément.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!