Exercice 20/20

  • Dans le fichier stylesheet.css, ajoutez le sélecteur qui permet de sélectionner chaque élément HTML qui est le troisième enfant de son parent;
  • Ajoutez également la règle CSS permettant de leur attribuez la couleur suivante #33ccff;
  • Cliquez sur soumettre ma réponse pour vérifier vos résultats;

Leçon 20/20

Cet exercice est un second rappel sur les sélecteurs de pseudo-classes.

Commentaires les mieux notés

  • fellakisouhail-71

    fellakisouhail-71

    Ce qui est bloqué voila la bonne reponse *:nth-child(3) { color:#33ccff; }

    le 19/01/2020 à 23h42

  • mestar.kenza-99

    mestar.kenza-99

    C'est bon, j'ai trouvé, merci

    le 22/10/2018 à 17h20

  • drif.zakaria-84

    drif.zakaria-84

    *:nth-child(3) {

    le 08/02/2020 à 10h10

  • AkashiOkami

    AkashiOkami

    Pour ce qui n'arrive pas , je vous conseil d'utilise :nth-child(x) vu dans exercice 15

    le 26/09/2018 à 19h26

  • nkeshimanabrice-37

    nkeshimanabrice-37

    ok bien dit...ca marche..

    le 15/10/2018 à 15h26

20 Commentaires

  • loutchay-74

    loutchay-74

    Bonjour, je souhaiterais savoir où se trouve mon erreur quand le correcteur affiche: Il vous manque la règle css pour chaque troisième enfant de son parent.

    le 10/08/2020 à 02h19

  • meriam

    meriam Admin

    Bonjour, vous devez utiliser un seul sélecteur qui permet de sélectionner chaque 3 ème enfant de son parent.

    le 10/08/2020 à 10h39

  • ambrillo-65

    ambrillo-65

    *:nth-child(3)&#123 {color:#33ccff;} Bonjour, cela ne fonctionne pas....

    le 04/08/2020 à 11h34

  • meriam

    meriam Admin

    Bonjour, supprimer ce code { et remplacez le par un accolade ouvrante {.

    le 04/08/2020 à 12h12

  • tiemoko91940-60

    tiemoko91940-60

    Si vous voulez appliquer une règle CSS à plusieurs éléments comme sur cette exemple, le plus simple est d'employer la code suivant : *:nth-child(3). l'étoile permet de notifier que vous souhaiter cibler plusieurs éléments.

    le 26/04/2020 à 23h24

  • annelaure.solas-66

    annelaure.solas-66

    @meriam : ça ne fonctionne toujours pas...

    le 16/04/2020 à 14h14

  • meriam

    meriam Admin

    Bonjour , le bon sélecteur c'est :nth-child(3) {}

    le 16/04/2020 à 15h56

  • sacha_cohen8-43

    sacha_cohen8-43

    p:nth-child(3){ color:#33ccff; } li:nth-child(3){ color:#33ccff; } div:nth-child(3){ color:#33ccff; } je ne vous pas mon erreur alors que j'ai les trois phrases en bleues

    le 15/04/2020 à 13h59

  • meriam

    meriam Admin

    Utilisez un seul sélecteur qui permet de sélectionner chaque 3 ème enfant de son parent au lieu d'utiliser trois sélécteurs.

    le 16/04/2020 à 01h57

  • splash.pub.tn-3

    splash.pub.tn-3

    *:nth-child(3){ color:#33ccff; }

    le 10/04/2020 à 00h54

  • segard.f31-53

    segard.f31-53

    *:nth-child(3){ color:#33ccff; }

    le 27/02/2020 à 14h07

  • drif.zakaria-84

    drif.zakaria-84

    *:nth-child(3) {

    le 08/02/2020 à 10h10

  • EL ABED.naila-44

    EL ABED.naila-44

    il faiut mettre *:nth-child(3){ color:#33ccff}

    le 02/02/2020 à 02h35

  • fellakisouhail-71

    fellakisouhail-71

    Ce qui est bloqué voila la bonne reponse *:nth-child(3) { color:#33ccff; }

    le 19/01/2020 à 23h42

index.html
stylesheet.css
<!DOCTYPE html> <html> <head> <link type="text/css" rel="stylesheet" href="stylesheet.css" /> <title>Rappel : les pseudo-classes 2</title> </head> <body> <div> <p>Je suis un paragraphe.</p> <p>Je suis un paragraphe.</p> <p>Je suis un paragraphe de couleur bleue.</p> <ul> <li>Je suis un élément de liste à puce.</li> <li>Je suis un élément de liste à puce.</li> <li>Je suis un élément de liste à puce de couleur bleue.</li> </ul> </div> <div> <p>Je suis un paragraphe.</p> </div> <div> <p>Je suis un paragraphe en bleu car j'hérite de la propriété de mon élément parent, c'est le principe de cascade en CSS.</p> </div> </body> </html>