Pourquoi `input:not(:empty)` ne correspond-il jamais à aucun élément ?

Comprendre le sélecteur CSS :not(:empty)

Le sélecteur :not() annule les critères de correspondance spécifiés entre ses parenthèses. Lorsqu'il est appliqué à la pseudo-classe :empty, le sélecteur :not(:empty) doit cibler les éléments qui ne sont pas vides. Cependant, les utilisateurs ont rencontré des difficultés à utiliser cette combinaison.

Le problème de l'élément Void

Le element est un élément vide, ce qui signifie qu’il n’a aucun contenu. Selon la définition HTML de « vide », les éléments void sont toujours considérés comme vides. Cela signifie qu'ils correspondront toujours à la pseudo-classe :empty, qu'ils aient ou non une valeur.

Implications des spécifications du sélecteur

La spécification des sélecteurs précise en outre que le La pseudo-classe :empty correspond aux éléments sans nœuds enfants ou aux nœuds de contenu de longueur non nulle. En tant que telle, la combinaison de input:not(:empty) ne correspondra jamais à aucun élément d'un document HTML valide.

Solutions alternatives

Style vide les champs utilisant dynamiquement CSS seul peuvent être difficiles. Cependant, il est possible de sélectionner des champs initialement vides dépourvus d'attribut de valeur (input[value=""]) ou ayant un attribut de valeur vide (input:not([value])). Au-delà de ces options, des méthodes alternatives peuvent être nécessaires pour gérer le style des champs champs.

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!