Maison >interface Web >tutoriel CSS >CSS `:not()` cible-t-il sélectivement uniquement les descendants immédiats ?

CSS `:not()` cible-t-il sélectivement uniquement les descendants immédiats ?

Patricia Arquette
Patricia Arquetteoriginal
2024-12-03 05:26:10854parcourir

Does CSS `:not()` Selectively Target Only Immediate Descendants?

Le sélecteur CSS :not() est-il destiné aux descendants éloignés ?

La pseudo-classe CSS3 :not(), telle que décrite dans la documentation officielle sur http://www.w3.org/TR/css3-selectors/#negation, est conçue pour faire correspondre les éléments qui ne correspondent pas à un sélecteur donné. Cependant, les utilisateurs ont trouvé des fonctionnalités limitées dans son utilisation avec des descendants distants.

Considérons l'exemple :

div :not(p) { color: red; }

Alors que ce sélecteur fonctionne lorsque

est un enfant direct de

, il échoue lorsque

est un descendant plus éloigné. Ce comportement est intentionnel, car :not() annule uniquement les descendants immédiats de l'élément cible.

Dans le cas où

contient un

, c'est le

lui-même qui correspond à *:not(p) et hérite du style. Le

L'élément lui-même compte toujours dans la négation, héritant de la couleur du texte de son parent.

Pour surmonter cette limitation, cibler

éléments directement est recommandé :

p { color: black; }

Sélecteurs niveau 4 propose d'améliorer :not() pour accepter des sélecteurs complexes complets contenant des combinateurs, permettant un ciblage descendant plus spécifique. Cependant, cette fonctionnalité est encore en phase de mise en œuvre.

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn