9
votes

CSS Sélectionnez le premier de type parmi les petits-enfants?

J'ai lu des questions difficiles telles que Sélectionnez le premier descendant avec CSS ou < Un href = "https://stackoverflow.com/questions/18772494/how-do-i-hide-only-the-first-Element-of-a-type"> Comment puis-je ne cacher que le premier élément d'un type ? Mais le mien ne correspond pas à ceux-ci.

J'ai cette structure HTML: xxx

et veulent sélectionner uniquement le premier petit-enfant < p> sous le .parent div.

Comment puis-je faire ça?


2 commentaires

Cela doit-il être une solution générique à ce que vous demandez (premier petit-fils arbitraire d'un élément arbitraire) ou juste pour votre code? Pour cela, vous pouvez utiliser p.interline: premier enfant .


J'ai essayé p.interline: premier enfant et il n'a pas fonctionné car, comme indiqué dans les réponses ci-dessous, je devrais avoir la sélection du premier

aussi , que je n'ai pas fait.


3 Réponses :


15
votes

Vous devez sélectionner le premier div aussi bien xxx

Démo

ici Dans le sélecteur ci-dessus, je sélectionne le premier p élément imbriqué à l'intérieur le premier div , qui est autrefois imbriqué comme l'enfant direct à un élément ayant une classe de de .parent

> signifie une descendante directe à son parent.


Ce qui précède échouera dans les anciennes versions d'Internet Explorer, donc si vous cherchez à les soutenir De plus, que le sélecteur pris en charge équivalent sera xxx

Démo (prend également en charge IE7 également)

mais en utilisant : premier enfant et : premier de type a une énorme différence, disons que vous utilisez p: premier enfant et vous avez un autre élément à part P , votre sélecteur échouera, c'est pourquoi je vous ai fourni une solution d'utilisation de : premier de type


0 commentaires

3
votes
.parent > div:first-child > p:first-child
Here you go, this should work for you

0 commentaires

0
votes

Ce serait .Parente p.Interline: premier enfant ou .primer .embline: premier enfant .


3 commentaires

Salut @shecodes, bienvenue sur le site! Cela ressemble à un bon début d'une réponse. Pouvez-vous ajouter plus de description de pourquoi cette réponse est correcte?


Comme indiqué ci-dessus, je n'ai pas fonctionné car le premier p -CHILD de chaque div est sélectionné.


Bonjour @kazark, merci pour l'accueil! @maxxyme Vous pouvez utiliser .Parrent Div: premier enfant .embline: premier enfant {couleur: rouge;} ou la réponse sélectionnée ci-dessus :)