Comment puis-je styliser tous les éléments sauf le premier à l'intérieur d'un élément ?

Utiliser efficacement le sélecteur 'not:first-child'

Lorsque vous stylisez des éléments dans un conteneur, il est souvent nécessaire d'appliquer des règles à tous les éléments sauf le premier. Comprendre comment utiliser efficacement le sélecteur « not:first-child » est crucial pour de tels scénarios.

Dans votre cas, vous essayiez de définir des propriétés CSS pour chaque balise « ul » dans une balise « div », à l'exclusion du premier. Bien que vos tentatives aient échoué, l'une des variantes que vous avez essayées fonctionne réellement dans les navigateurs modernes :

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

Ce sélecteur exploite les sélecteurs CSS de niveau 3 et cible toutes les balises 'ul' dans 'div' qui ne sont pas les premières. enfant.

Cependant, si vous devez prendre en charge les navigateurs existants ou si vous êtes confronté aux limitations du sélecteur ':not', une approche alternative est disponible :

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

div ul {
    background-color: #900;  /* applies to every ul */
}

2. "Révoquer" la règle sous condition pour limiter sa portée aux éléments ciblés :

div ul:first-child {
    background-color: transparent; /* limits the scope of the previous rule */
}

En revenant aux attributs par défaut pour les propriétés CSS modifiées, vous pouvez efficacement restreindre les règles aux valeurs souhaitées. éléments.

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!