Comment puis-je exclure le premier élément à l'aide des sélecteurs CSS ?

Exclusion du premier élément avec le sélecteur CSS :not:first-child

En CSS, le sélecteur :first-child cible le premier élément enfant de son élément parent. Pour exclure le premier élément, vous pouvez utiliser le sélecteur inverse :not:first-child.

Tentative 1 : Utiliser :not:first-child

div ul:not:first-child {
    background-color: #900;
}

Tentative 2 : Utiliser :not(:first-child)

div ul:not(:first-child) {
    background-color: #900;
}

Tentative 3 : Utilisation de :first-child:after

div ul:first-child:after {
    background-color: #900;
}

Cependant, aucun de ces éléments méthodes ont obtenu le résultat souhaité.

Solution : Utilisation de la compatibilité du navigateur Correction

Le sélecteur :not n'accepte qu'un simple sélecteur comme argument. Par conséquent, pour prendre en charge les navigateurs existants qui ne prennent pas en charge la syntaxe :not(:first-child), vous pouvez utiliser une technique alternative :

1. Définir une règle avec une portée plus large que prévu :

div ul {
    background-color: #900;
}

2. "Révoquer" la règle sous condition pour limiter sa portée aux exclus element:

div ul:first-child {
    background-color: transparent;
}

Explication:

La première règle applique la couleur d'arrière-plan à tous les éléments ul. La deuxième règle utilise la valeur par défaut (transparent) pour background-color, supprimant ainsi la couleur d'arrière-plan du premier élément ul enfant.

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!