Comment ne pas sélectionner le premier enfant en CSS

Dans les applications Web, les sélecteurs sont utilisés pour styliser des éléments HTML spécifiques via CSS. Par exemple, lorsque vous avez beaucoup de contenu sur votre page et qu'il est nécessaire de sélectionner quelques éléments, vous devriez opter pour les sélecteurs CSS. Dans CSS, une variété de sélecteurs vous aideront à sélectionner l'élément spécifique dans le groupe d'éléments.

Dans cet article, nous couvrirons comment ne pas sélectionner le premier enfant en CSS.

Comment ne pas sélectionner le premier enfant en CSS?

Dans CSS, pour ne pas sélectionner le premier enfant, vous pouvez utiliser les sélecteurs donnés:

• : pas (: premier enfant)
• : pas (: nième de type (1))
• : pas (: premier de type)

Alors, commençons!

Méthode 1: Utilisation: pas (: premier enfant) pour ne pas sélectionner First Child

Le ": pas (: premier enfant)»Selector définit la règle qui ne sélectionne pas le premier enfant de la balise parent. Ce sélecteur nous aidera à exclure le style CSS appliqué pour le premier élément.

Prenons un exemple simple et découvrons comment nous pouvons appliquer le sélecteur pour ne pas sélectionner le premier enfant.

Exemple

Voici trois textes d'ancrage sur notre page ayant une couleur verte. Excluons la couleur verte uniquement pour le premier élément texte:

Nous avons spécifié la balise d'ancrage "" dans le "<corps> ”De votre fichier html:

Mon premier lien

Mon deuxième lien

Mon troisième lien

Ensuite, utilisez la balise parent qui est «corps"Et l'étiquette d'enfant qui est"un" avec ":pas (: premier enfant))”Sélecteur dans la feuille de style. Ensuite, ajoutez le CSS "couleur«Propriété avec la valeur»vert» La couleur sera appliquée sur tous les éléments sauf le premier enfant:

Maintenant, enregistrez le code ajouté et ouvrez-le dans le navigateur simplement ou en utilisant le serveur en direct:

Comme vous pouvez le voir, nous n'avons appliqué la couleur qu'à tous les éléments sauf le premier:

Méthode 2: Utilisation: pas (: nth de type (1)) pour ne pas sélectionner le premier enfant

Le "pas (: nième de type ())»Selector vous permet de choisir un ou plusieurs élément de la séquence. Si seulement (: nth de type (1)) est utilisé, le sélecteur sélectionnera le premier enfant; Cependant, quand: non est placé devant lui, le premier enfant sera exclu.

Nettoyons le concept: pas (: n ° de type (1)) en utilisant l'exemple ci-dessous.

Exemple

Ici, nous allons définir le «pas (: nième de type (1))«Sélecteur, où«1»Représente que le premier enfant sera exclu. Ensuite, affectez le «couleur«Propriété une valeur de«orange»:

Sortir

Méthode 3: Utilisation: pas (: premier de type) pour ne pas sélectionner First Child

Le sélecteur (: premier de type) correspondra à la première occurrence d'un élément et: il n'est pas ajouté derrière ": pas (: premier de type)«Pour sauter la première occurrence.

Exemple

Dans cet exemple, le «: pas (: premier de type)»Selecteur sera appliqué pour exclure le premier enfant de son parent. Ensuite, définissez la valeur "bleu" pour le "couleur" propriété:

Nous vous avons fourni des conseils sur la façon de ne pas sélectionner le premier enfant avec succès.

Conclusion

Pour ne pas sélectionner le premier enfant, utilisez ": pas (: premier enfant)»,«:pas (: nième de type (1))" ou ":pas (: premier de type)»Sélecteurs. Sans utiliser: non, ces sélecteurs ne sélectionneront que le premier enfant et en sauteront les autres. Cependant, quand: non est placé devant ces sélecteurs, il sera alors tenu de sauter uniquement le premier enfant de son parent. Dans cet article, nous avons couvert trois méthodes efficaces pour ne pas sélectionner le premier enfant dans CSS.