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

  • 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

  • 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

  • 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 Admin

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

    le 06/07/2016 à 22h37

  • dagbaaxel20-58

    dagbaaxel20-58

    a:hover{ text-decoration: none; } a:hover:first-child{ color: #cdbe70; } a:hover:last-child { color: #ffc125; } POURQUOI CA NE FONCTIONNE PAS ?

    le 10/12/2019 à 20h27

20 Commentaires

  • elsapings-86

    elsapings-86

    bonjour, je n'arrive pas à voir mon erreur svp! a:hover{ text-decoration:none; } a:first-child { color:#cdbe70; } a:nth-child(3){ color:#ffc125; }

    le 22/09/2020 à 12h21

  • meriam

    meriam Admin

    Bonjour, dans votre fichier html, vous ajoutez la balise fermante </a> et ajoutez du contenu textuel entre la balise ouvrante et fermante.

    le 22/09/2020 à 15h07

  • pacoyasix-65

    pacoyasix-65

    salut j'ai un prob ds la premiere balise a "il manque la regle css pour la 1 a "

    le 04/09/2020 à 20h47

  • meriam

    meriam Admin

    il suffit de supprimer la pseudo-classe :hover du 2 ème et 3ème sélècteur.

    le 07/09/2020 à 21h58

  • loutchay-74

    loutchay-74

    Bonjour, maintenant, j'ai la tête qui tourne en voyant le correcteur afficher: Il vous manque la règle css pour la première balise a. Au départ s'était la troisième et là, c'est la première. Pouvez-vous éclairer mes petites cellules grises? Par avance, merci. :-))

    le 10/08/2020 à 20h41

  • meriam

    meriam Admin

    Bonjour, corrigez le 2 ème sélecteur qui doit cibler le 1 er lien (Lisez bien l'énoncé :Attribuez la couleur #cdbe70 au premier lien;)

    le 11/08/2020 à 12h04

  • meriam

    meriam Admin

    Vous pouvez utiliser la pseudo classe a:first-child au lieu d'utiliser a:nth-child(2) qui cible le 2 ème lien)

    le 11/08/2020 à 12h13

  • loutchay-74

    loutchay-74

    Bonjour, le correcteur affiche: Il vous manque la règle css pour la troisième balise a. Je crois que j'ai un trou de mémoire... :-))

    le 10/08/2020 à 01h58

  • meriam

    meriam Admin

    Attribuez la couleur #ffc125 au troisième lien et non pas au deuxième lien.

    le 10/08/2020 à 10h54

  • ermond.sasson-60

    ermond.sasson-60

    Bonjour mon code semble bon est on me met une erreur a:link &#123; text-decoration: none; } a:hover:first-child &#123; color: #cdbe70; } a:hover:nth-child(3) &#123; color: #ffc125; }

    le 01/08/2020 à 13h33

  • meriam

    meriam Admin

    Bonjour, pour le 1 er sélécteur, il faut utiliser la pseudo-classe :hover et non pas la pseudo-classe :link.

    le 03/08/2020 à 11h51

  • aboubadoumbia63-68

    aboubadoumbia63-68

    Bonjour, je ne vois pas mon erreur. Le code est le suivant: a:hover&#123; text-decoration: none; } a:nth-child(2)&#123; color: #cdbe70; } a:nth-child(3)&#123; color: #ffc125; }

    le 21/07/2020 à 23h45

  • meriam

    meriam Admin

    Bonjour, le 2ème sélecteur n'est pas correct, il faut sélectionner le premier lien et non pas le deuxième.

    le 22/07/2020 à 15h58

  • vix.ax-9

    vix.ax-9

    Merci beaucoup pour la réponse !

    le 17/07/2020 à 14h28

  • meriam

    meriam Admin

    je vous en prie

    le 17/07/2020 à 14h48

  • vix.ax-9

    vix.ax-9

    désolé pour le double message, je voulais faire un retour à la ligne. Il me dit qu'il manque une régle css pour la première balise A pourtant le changement de couleur est visible

    le 16/07/2020 à 12h18

  • meriam

    meriam Admin

    Bonjour, au lieu d'écrire body a { } écrivez directement a {} (pour le 2ème et le 3 ème sélcteur)

    le 17/07/2020 à 11h12

  • hanane_thami-44

    hanane_thami-44

    bonjour, j arrive pas à resoudre le probléme il me semble que j'ai tout bon

    le 12/07/2020 à 16h49

  • meriam

    meriam Admin

    bonjour, vous n'avez pas respecté l'énoncé.

    le 13/07/2020 à 12h14

  • meriam

    meriam Admin

    on ne demande pas d'utiliser visited et link.

    le 13/07/2020 à 12h14

  • pertijo-46

    pertijo-46

    Je ne comprends pas mon erreur(Vous devez avoir une première balise a dans votre body)

    le 14/06/2020 à 12h25

  • meriam

    meriam Admin

    Supprimez la liste ul et les éléments li, utilisez les directement les liens a.

    le 15/06/2020 à 02h09

  • pwd.phildavis-32

    pwd.phildavis-32

    Help! J'ai écrit le code comme ça mais il ne marche pas: a:hover &#123; text-decoration: none; } #pbs&#123; color: #cdbe70; } #atlantic&#123; color: #ffc125; }

    le 08/06/2020 à 22h16

  • meriam

    meriam Admin

    Bonjour, l'énonce demande d'utiliser les pseudo-classes et non pas les id.

    le 09/06/2020 à 15h45

  • Jiink0-77

    Jiink0-77

    Bonjour, je ne vois pas mon erreur ?

    le 08/06/2020 à 19h33

  • meriam

    meriam Admin

    Bonjour, utilisez les pseudos-classes :nth-child(x) au lieu d'utiliser les classes.

    le 09/06/2020 à 13h41

  • annelaure.solas-66

    annelaure.solas-66

    ah oui en effet super merci @meriam

    le 16/04/2020 à 14h09

index.html
stylesheet.css
<!DOCTYPE html> <html> <head> <link type="text/css" rel="stylesheet" href="stylesheet.css" /> <title>Rappel : les pseudo-classes 1</title> </head> <body> </body> </html>