Pouvez-vous appliquer des styles aux pseudo-éléments avec le sélecteur universel ?

Sélecteur universel versus pseudo-éléments

Le sélecteur universel () n'affecte pas directement les pseudo-éléments (:before, :after) car ce ne sont pas de véritables éléments. Un simple sélecteur comme cible uniquement les éléments, tandis que les pseudo-éléments sont des entités distinctes dans le DOM.

Pour appliquer des styles aux pseudo-éléments, il faut inclure le pseudo-élément correspondant dans le sélecteur. Par conséquent, :before, :after est nécessaire pour affecter ces pseudo-éléments.

Utilisation de * { box-sizing: border-box; } seul n'affectera pas les pseudo-éléments car le dimensionnement de la boîte n'est normalement pas hérité. Au lieu de cela, les pseudo-éléments conserveront leur valeur par défaut de content-box.

Dans certains cas, les pseudo-éléments peuvent apparaître à côté du sélecteur universel dans une chaîne de sélecteur (par exemple, *, :before, :after). Cependant, le sélecteur universel peut être omis s'il n'est pas le seul composant de la chaîne.

Bien que les pseudo-éléments soient affichés en ligne par défaut, le dimensionnement de la boîte ne les affecte pas lorsqu'ils sont en ligne.

Lors de l'application de styles à des pseudo-éléments en utilisant la notation simple deux-points (:before, :after), il est important de se rappeler qu'IE8 ne prend pas en charge la notation double deux-points (::before, ::after).

Enfin, même si :before, :after applique des styles à tous les pseudo-éléments, ils ne seront pas générés tant que la propriété content n'est pas appliquée.

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!