Comment exclure des éléments avec un nom de classe spécifique dans les sélecteurs CSS ?

Exclusion d'un nom de classe spécifique dans les sélecteurs CSS

En CSS, il est souvent nécessaire de cibler des éléments en fonction de noms de classe spécifiques. Toutefois, lorsque plusieurs noms de classes sont présents sur un élément, le ciblage peut devenir plus complexe. Un défi courant consiste à exclure les éléments qui ont un nom de classe particulier.

Considérez le scénario suivant :

• Vous souhaitez appliquer une couleur d'arrière-plan lorsque la souris survole un élément avec le " reMode_hover".
• Cependant, vous ne souhaitez pas changer la couleur si l'élément possède également la classe "reMode_selected".

Pour exclure des éléments avec un certain nom de classe, vous pouvez utiliser le sélecteur « non ». Ce sélecteur vous permet de cibler les éléments qui ne correspondent pas à une condition spécifiée. Dans ce cas, vous utiliseriez :

<code class="css">.reMode_hover:not(.reMode_selected):hover {
  background-color: #f0ac00;
}</code>

Ce sélecteur appliquerait la couleur d'arrière-plan à tout élément avec la classe "reMode_hover", à condition qu'il n'ait pas également la classe "reMode_selected". Il exclut effectivement les éléments qui satisfont aux deux conditions.

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!