Exercice 19/20

  • Dans le fichier index.html, ajoutez trois liens dans le body. Ils peuvent mener vers le site web de votre choix.
  • Dans le fichier stylesheet.css, attribuez la valeur none à la propriété text-decoration pour tout lien qui sera survolé (a:hover);
  • Attribuez la couleur #cdbe70 au premier lien;
  • Attribuez la couleur #ffc125 au troisième lien;
  • Cliquez sur soumettre ma réponse pour vérifier vos résultats;

Leçon 19/20

Cet exercice est un premier rappel sur les pseudo-classes.

Commentaires les mieux notés

  • qudsiabhojani-7

    Je ne comprend pas s'il vous plaît aide- moi

  • audebertt-85

    pourrez-vous m'aider svp?

  • phaelier

    Bonsoir Je ne comprends pas: "Vérifiez la syntaxe du sélecteur pour un lien survolé."

  • mram Administrateur

    J'ai modifié la correction. ça devrait être bon maintenant.

49 Commentaires

  • audebertt-85

    audebertt-85

    pourrez-vous m'aider svp?

    le 28/05/2018 à 13h53

  • mram

    mram Administrateur

    Ok pour le 3eme sélecteur CSS, mais les deux premiers ne sont pas bons. Il faut utiliser d'autres pseudo-classes que vous avez déjà vues normalement.

    le 02/06/2018 à 04h25

  • phaelier

    phaelier

    Bonsoir Je ne comprends pas: "Vérifiez la syntaxe du sélecteur pour un lien survolé."

    le 06/07/2016 à 22h25

  • mram

    mram Administrateur

    J'ai modifié la correction. ça devrait être bon maintenant.

    le 06/07/2016 à 22h37

  • ricafortjason

    ricafortjason

    a:hover { text-decoration: none; } a:first-child { color: #cdbe70; } a:last-child { color: #ffc125; }

    le 02/12/2016 à 15h43

  • lm.monlouis

    lm.monlouis

    desolé encore ça ne me la pas validé car j'avais mal copier/coller le code couleur

    le 09/02/2017 à 20h20

  • mram

    mram Administrateur

    Votre code est juste, où est votre souci ??

    le 05/12/2016 à 23h55

  • lm.monlouis

    lm.monlouis

    Bonjour, je viens d'utilise le pseudo-style de ricafortjason, mais avant cela j'ai utiliser a:nth-child(x) en choisissant le 1 et 3 ça n'a pas voulu me validé, c'est une méthode incorrecte?

    le 09/02/2017 à 20h17

  • bantasiby1

    bantasiby1

    Bonjour, je suis bloqué, aider-moi s'il vous plait

    le 29/05/2017 à 20h19

  • bantasiby1

    bantasiby1

    Bonjour, je suis bloqué, aider-moi s'il vous plait. a:hover { text-decoration: none; } a:first-child { color: #cdbe70 } a:last-child { color: #ffc125; }

    le 29/05/2017 à 20h20

  • annelaure.mesguen

    annelaure.mesguen

    Bloquée...utilisation de id dans les deux liens, un petit coup de main ? merci ! (même pb avec utilisation de class) HTML: <body> <a id="couleur1" href="https://3wa.fr"> Site de 3WA" >/a> <a href="https://3wa.fr">Site de 3WA" >/a> <a id="couleur2" href="https://3wa.fr"> Site de 3WA" >/a> </body> CSS: a:hover { text-decoration:none; } #couleur1 { color:#cdbe70; } #couleur2 { color:#ffc125; }

    le 14/06/2017 à 15h56

  • mram

    mram Administrateur

    Bonjour,

    C'est ok pour la pseudo-classe ":hover" mais il existe aussi des pseudos-classes pour cibler spécifiquement le premier enfant et le dernier enfant, en l'occurrence ici le premier et le dernier lien. Donc pas besoin d'ajouter un id ou une classe.

    le 14/03/2016 à 23h37

  • annelaure.mesguen

    annelaure.mesguen

    ok, merci !

    le 18/03/2016 à 19h17

  • mram

    mram Administrateur

    Il manque le point-virgule en fin de ligne 5.

    le 02/06/2017 à 00h11

  • hassanaposte-27

    hassanaposte-27

    mram je fais le résultat. mais je ne peux pas valider

    le 04/08/2018 à 23h45

  • mram

    mram Administrateur

    Bonjour, que vous dit le message exactement ?

    le 13/08/2018 à 03h18

  • andrade.meilyn-42

    andrade.meilyn-42

    Voici la solution: a:hover{ text-decoration:none; } a:first-child{ color:#cdbe70; } a:nth-child(3){ color:#ffc125; } Il faut bien lire le texte, je crois qu'on comprends tous mal avec le hover. et ça nous embrouille les neurones

    le 28/05/2018 à 03h25

  • steve.besson

    steve.besson

    non la je ne sais pas -_-...

    le 11/11/2017 à 15h51

  • mram

    mram Administrateur

    Essayez au moins quelque chose, vous n'avez pas écrit de code.

    le 16/11/2017 à 16h25

  • nad35

    nad35

    Après correction, nouveau message erreur:Vérifiez la syntaxe du sélecteur pour le premier lien.,Vérifiez la syntaxe du sélecteur pour le troisième lien. Merci pour votre aide

    le 20/09/2018 à 15h23

  • meriam

    meriam Administrateur

    Pour le sélecteur du premier lien, vous pouvez utiliser
    a:nth-child(1) { color:#cdbe70;}

    le 04/10/2018 à 16h51

  • helene.patat-87

    helene.patat-87

    Bizarre, encore un exercice où je mets liens dans la balise <body> et message d'erreur : vérifier qu'il y a bien liens dans <body>...!! Que faire ?

    le 22/03/2018 à 18h41

  • mram

    mram Administrateur

    Bonjour, supprimez les balises <br> et réessayez.

    le 24/03/2018 à 06h18

  • ioana.antonesei-21

    ioana.antonesei-21

    Vous pouvez utilise la pseudo-classe :nth-child

    le 02/05/2018 à 18h51

  • cmacherel

    cmacherel

    Là, je suis perdue. Rien ne marche. Mon message est: "Vérifiez la syntaxe du sélecteur pour le premier lien.,Vérifiez la syntaxe du sélecteur pour le troisième lien.,Vous devriez avoir 1 élément html avec la règle CSS "color: #cdbe70".,Vous devriez avoir 1 élément html avec la règle CSS "color: #ffc125"."

    le 12/09/2018 à 14h33

  • mram

    mram Administrateur

    C'est nth-child et pas nthchild.

    le 15/09/2018 à 07h42

  • david.debandt-71

    david.debandt-71

    question pratique : comment appliquer a:hover juste au premier lien? on ne peut pas additionner les a:hover et a:first-child sur une même ligne.

    le 31/01/2018 à 09h46

  • mram

    mram Administrateur

    Bonjour, il suffit de lui mettre une class CSS propre à lui pour l'identifier. Non on ne peut pas mettre à la suite "a:hover a:first-child" car là on sélectionne tout lien qui est premier enfant de sont parent à l'intérieur d'un lien survolé.

    le 05/02/2018 à 10h46

  • severine.74

    severine.74

    Bonjour, je ne comprends pas mes erreurs, pouvez vous m'aider s'il vous plait? d'avance merci

    le 01/02/2018 à 17h41

  • mram

    mram Administrateur

    Bonjour, vous utilisez des sélecteurs d'identifiant ( #color1 ...) or on souhaite que vous utilisez des sélecteurs de pseudo-classe.

    le 05/02/2018 à 11h15

  • vfaiola-21

    vfaiola-21

    help me please, je suis bloquée

    le 25/07/2018 à 16h23

  • mram

    mram Administrateur

    Bonjour le code lignes 1 à 3 est inutile.

    Avez-vous aussi essayé avec :nth-child() ?

    le 01/08/2018 à 06h15

  • lorenefelx-51

    lorenefelx-51

    Bonjour, je ne comprends pas mon erreur...

    le 19/04/2018 à 16h49

  • mram

    mram Administrateur

    Bonjour, il faut préciser la balise devant la pseudo-classe (mais ce n'est pas obligatoire dans tous les cas).

    le 23/04/2018 à 03h57

  • bobjecode

    bobjecode

    bonjour,la non plus je trouve pas!

    le 24/09/2017 à 18h00

  • mram

    mram Administrateur

    Bonjour , l'erreur est dans le HTML. Vous avez mis des "li" mais il n'y a pas de liste "ul" ou "ol" ...

    le 25/09/2017 à 17h45

  • bruel.william-2

    bruel.william-2

    Bonjour, pourriez vous maider je suis bloquer

    le 10/04/2018 à 15h20

  • mram

    mram Administrateur

    Bonjour : id=color2 , il faut mettre le nom de l'id entre guillemets.

    le 11/04/2018 à 05h58

  • naim-khezzar

    naim-khezzar

    je comprend quand on me dit de vérifier si il y a du contenu dans la balise <a>! j'ai du mal a faire des liens.

    le 12/01/2018 à 19h12

  • mram

    mram Administrateur

    Bonjour, ne mettez pas de balise "p" dans les liens "a". Mettez juste du texte.

    le 16/01/2018 à 19h20

  • nkeshimanabrice-37

    nkeshimanabrice-37

    pouvez-vous me corriger je ne vois pas l'erreur...

    le 15/10/2018 à 15h21

  • meriam

    meriam Administrateur

    Il faut utiliser les pseudo-classes, lisez bien l'exercice, pas besoin d'ajouter des id partie html.

    le 15/10/2018 à 16h12

  • francelinloic

    francelinloic

    Bonjour je bloque alors que celà fonctionne. Merci

    le 18/09/2017 à 20h09

  • mram

    mram Administrateur

    Bonjour, il faut un espace entre le sélecteur et l'accolade {

    le 20/09/2017 à 15h34

  • comm

    comm Administrateur

    Où est mon erreur ? :)

    le 28/08/2018 à 17h44

  • dmjolison40

    dmjolison40

    Bonjour, je suis bloqué et je ne vois pas mon erreur, savez-vous m'aider s'il vous plait ? merci

    le 11/04/2018 à 01h33

  • mram

    mram Administrateur

    Bonjour, il y avait un sélecteur CSS en trop (le premier), là c'est bon.

    le 11/04/2018 à 06h03

  • bruel.william-2

    bruel.william-2

    C'est fait mais je ne peut toujours pas validé !

    le 11/04/2018 à 15h51

  • mram

    mram Administrateur

    Bonjour, il ne faut pas toucher au code HTML (ajout des id). Il faut juste utiliser les bons sélecteurs CSS. Le "a:hover" est ok, mais pour les deux autres il faut utiliser une pseudo-classe aussi.

    le 15/04/2018 à 01h46

  • nad35

    nad35

    Bonjour, je ne comprends pas mon erreur. Vérifiez que vous avez bien 3 liens <a> dans la balise <body>., Vérifiez la syntaxe du sélecteur pour le premier lien.,Vérifiez la syntaxe du sélecteur pour le troisième lien.,Vous devriez avoir 1 élément html avec la règle CSS "color: #cdbe70".,Vous devriez avoir 1 élément html avec la règle CSS "color: #ffc125". Merci pour votre aide

    le 17/09/2018 à 12h15

  • mram

    mram Administrateur

    Bonjour, pas besoin des "li", il faut en effet mettre les liens directement dans "body".

    Enfin, il y a un équivalent plus simple que :nth-child(3) (bien que ce soit correct aussi).

    le 02/10/2018 à 05h42

  • vahan.barsamian

    vahan.barsamian

    Mon code fonctionne, de l'aide pour valider le niveau svp

    le 07/08/2017 à 16h53

  • mram

    mram Administrateur

    Bonjour, dans le CSS : ligne 1 pas besoin de mettre "div" , "a:hover" permet de cibler tout les liens de la page et c'est ce qu'on veut. Pour les deux autres sélecteurs, pas besoin d'utiliser "hover".

    le 09/08/2017 à 11h18

  • vahan.barsamian

    vahan.barsamian

    ne veut pas se valider

    le 07/08/2017 à 16h54

  • deuxs-95

    deuxs-95

    Help me please : l'affichage fonctionne mais message d'erreur concernant la syntaxe. Merci

    le 31/08/2018 à 09h16

  • mram

    mram Administrateur

    Bonjour, que vous dit le message d'erreur exactement ?

    le 06/09/2018 à 06h09

  • bmontebello

    bmontebello

    je ne trouves pas mon erreur

    le 11/01/2018 à 15h08

  • mram

    mram Administrateur

    Bonjour, il faut utiliser des pseudo-classes déjà vues auparavant à la place de vos sélecteurs "#couleur1" et "#couleur2" .

    le 12/01/2018 à 02h29