Sélectionnez tous les éléments enfants récursivement dans CSS

Sélectionnez tous les éléments enfants récursivement dans CSS

La méthode couramment utilisée pour sélectionner les éléments HTML dans CSS est d'ajouter l'ID ou le sélecteur de classe de l'élément particulier, puis appliquer les propriétés CSS dans l'élément. Mais, s'il est nécessaire de sélectionner différents types d'éléments enfants associés à un élément monoparental. Par exemple, un élément de portée, un élément de paragraphe ou un élément de cap en tant qu'enfant d'un seul élément div, le "*”Symbole suivi du sélecteur est utilisé dans l'élément de style CSS.

Cet article démontrera la méthode pour sélectionner tous les éléments enfants.

Comment sélectionner tous les éléments enfants récursivement?

Pour sélectionner les éléments enfants, le développeur doit ajouter l'ID ou le sélecteur de classe de l'élément parent avec le «*”Symbole à la fin dans l'élément de style CSS, puis ajoutez les propriétés à l'intérieur.

Exemple

Ajoutons un exemple simple pour comprendre l'explication ci-dessus:


Paragraphe 1


> Paragraphe n ° 2

Paragraphe n ° 3


> Paragraphe n ° 4



> Paragraphe n ° 5


> Paragraphe n ° 6


> Paragraphe n ° 7


Dans l'extrait de code ajouté ci-dessus:

    • UN ""L'élément est ajouté avec une classe déclarée"Ma classe".
    • À l'intérieur de "«Élément, quatre sous-éléments sont définis en utilisant«

      ","","

      ", et ""Tags avec le texte"Paragraphe 1","Paragraphe n ° 2","Paragraphe n ° 3", et "Paragraphe n ° 4", respectivement.

    • Après la clôture ""Tag, trois""Des éléments sont ajoutés qui ne sont pas associés à ce qui précède"" élément. Ils sont ajoutés juste pour différencier ceux qui sont les éléments enfants associés au parent div et ceux qui sont des éléments indépendants.

Maintenant, afin de sélectionner tous les éléments enfants de la div, le «*”Symbole avec le nom de l'ID ou de la classe Parent peut être utilisé:

.Ma classe *
Color d'arrière-plan: PowderBlue;
bloc de visualisation;
Texte-aligne: Centre;


Dans l'extrait de code ci-dessus:

    • Le "*"Symbole est ajouté suivi par le".Ma classe»Sélecteur qui est l'élément parent contenant quatre éléments différents à l'intérieur comme ses éléments enfants.
    • À l'intérieur, le «Couleur de l'arrière plan«La propriété a été définie comme«poudre bleue". Cette propriété ajoute la couleur d'arrière-plan aux éléments enfants.
    • "bloc de visualisation" et "Texte-aligne: Centre»Les propriétés ont été définies pour aligner les éléments enfants sur le centre de l'interface.

L'exemple ci-dessus appliquera les propriétés CSS aux éléments enfants de l'élément parent associé à la classe "Ma classe". Ces propriétés ne seront pas appliquées à d'autres éléments qui ne sont pas les éléments enfants du div associé à la classe «myclass»:


Il s'agit de sélectionner tous les éléments enfants récursivement dans CSS.

Conclusion

Pour sélectionner tous les éléments enfants d'un élément parent particulier, il est nécessaire d'ajouter le «*”Symbole après l'ID ou le sélecteur de classe de l'élément parent dans l'élément de style CSS. Les propriétés CSS ajoutées à l'intérieur seront ensuite implémentées sur tous les éléments enfants. Cet article a fourni un guide complet de la méthode pour sélectionner tous les éléments enfants de CSS.