Exercice 13/14

  • Entre les balises <body> et </body>, ajoutez deux images avec <img>. L'une d'elles doit être cliquable, l'autre non. Le lien peut mener vers une cible de votre choix.

  • Après avoir ajouté vos deux images, écrivez une ligne de texte et rendez-la cliquable à son tour. Ce lien peut envoyer vers une page web de votre choix.

Lisez l'astuce en cas de besoin.

Leçon 13/14

Vous venez d'apprendre l'essentiel de la construction de pages web : insérer des images et des liens.

Révisons un peu ces fondamentaux avant de passer à la suite.

Les images fonctionnent de la manière suivante :

 <img src="URL de l'image" />

Les liens fonctionnent de la manière suivante :

 <a href="URL du site web sur lequel va mener le lien" > </a>

Vous pouvez aussi créer un lien à partir d'une image :

 <a href="URL du site web sur lequel va mener le lien"> <img src = "URL de l'image" /></a>

Commentaires les mieux notés

850 Commentaires

  • magomed35-17

    magomed35-17

    Bonjour, on me dit que je n'ai pas d'image cliquable alors que j'en ai une. Une erreur de ma part ?

    le 07/03/2023 à 11h24

  • Patricio M

    Patricio M Admin

    AUcun erreur de mon coté!

    le 08/03/2023 à 08h01

  • jansenamandine-34

    jansenamandine-34

    Bonjour, je ne comprends, on me dit pas de "texte cliquable", pourtnat j'ai utilisé les balises d'astuce. Merci de votre aide

    le 01/03/2023 à 05h27

  • Patricio M

    Patricio M Admin

    Amandine, tu dois écrire du texte entre les balises

    le 01/03/2023 à 08h54

  • Alex44

    Alex44

    Help

    le 22/02/2023 à 19h40

  • Patricio M

    Patricio M Admin

    Alex, no help needed for you, Tout marche bien!

    le 23/02/2023 à 08h10

  • seunolas147-14

    seunolas147-14

    bonjour ,comment créer une image clickable svp ?

    le 17/02/2023 à 14h16

  • Patricio M

    Patricio M Admin

    Regarde l'astuce, c'est assez clair

    le 20/02/2023 à 08h25

  • bberlu-52

    bberlu-52

    bonjour je ne comprend pas l erreur dans mon code .quelqu un pourrait m aider ? :

    le 17/02/2023 à 11h21

  • Patricio M

    Patricio M Admin

    La consigne dit bien 1 clickeable, l'autre non... pas besoin d'avoir 2 balises <a>

    le 20/02/2023 à 08h23

  • mitrachealessandra-11

    mitrachealessandra-11

    Bonjour, j'ai réussi l'exercice, or je ne comprends pas pourquoi c'est la première image qu'on fermer avec la balise </a> et quand on ferme la balise sur la deuxième image il y a erreur ?

    le 06/02/2023 à 12h21

  • Patricio M

    Patricio M Admin

    Dernier code........OK

    le 06/02/2023 à 15h22

  • eprigent29-42

    eprigent29-42

    Dès que j'insère l'url d'une image un message d'erreur s'affiche à gauche "Named entity expected. Got none" Est-ce que vous savez à quoi ça correspond?

    le 27/01/2023 à 04h05

  • Patricio M

    Patricio M Admin

    C'est pas grave, c'est juste que tu as un & quelque part et il attends le nom de l'entité après ce caracthère.

    le 27/01/2023 à 08h43

  • salhi.chaim4-81

    salhi.chaim4-81

    bonjour je vois pas où pourrait être mon erreur

    le 22/01/2023 à 15h34

  • Patricio M

    Patricio M Admin

    lis bien la consigne

    le 23/01/2023 à 13h30

  • t.marchand918-30

    t.marchand918-30

    Bonjour je n'arrive pas à comprendre comment mettre en valeur l' attribut href

    le 23/11/2022 à 15h09

  • Patricio M

    Patricio M Admin

    Je ne comprends pas ton METTRE EN VALEUR. La consigne est claire n'est ce pas?

    le 24/11/2022 à 14h32

  • sol.ahlam-29

    sol.ahlam-29

    Voici mon code : <!DOCTYPE html> <html> <head> <title></title> </head> <body> <img src="https://cdn.pixabay.com/photo/2021/12/02/19/14/elephant-6841179__340.jpg" /> <a href="https://pixabay.com/fr/"><img src="https://www.lyonbureaux.news/wp-content/uploads/2016/08/images-gratuites.jpg" /></a> </body> </html>

    le 25/10/2022 à 14h52

  • Patricio M

    Patricio M Admin

    Où est le texte clickeable, lis bien les consignes

    le 26/10/2022 à 07h24

  • iharylala-76

    iharylala-76

    Bonjour, pourriez vous me dire où est mon problème svp<!DOCTYPE html> <html> <head> <title></title> </head> <body> <a href="https://pixabay.com">/photo/2016/05/20/16/40/flag-1405373_960_720.jpg<img src="https://gallery.igen.fr/macgpic-1530010777-10460526663430-sc-jpt-jpt.jpg"/><p>vous pouvez lire ici</p></a> </body> </html>

    le 19/10/2022 à 14h58

  • Patricio M

    Patricio M Admin

    LIs bien la consigne, please

    le 20/10/2022 à 07h22

  • hafida-62

    hafida-62

    bonjour, voici mon code mais il n'est pas valide. Je ne sais pas pouquoi. <!DOCTYPE html> <html> <head> <title></title> </head> <body> <a href="google.fr"> <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/3/3a/Tim_Berners-Lee_closeup.jpg/160px-Tim_Berners-Lee_closeup.jpg" /> </a> <a href="google.fr"> <p> clique ici</p></a> </body> </html>

    le 10/10/2022 à 17h29

  • Patricio M

    Patricio M Admin

    UNE image clickeable et UNE image NON clickeable, lis bien les consignes

    le 11/10/2022 à 11h31

  • judithblot-93

    judithblot-93

    Avez-vous bien placé la balise </a> ? toujours la même chose, pourtant a est bien fermée et les liens sont cliquables. Merci de ton aide.

    le 27/09/2022 à 16h14

  • Patricio M

    Patricio M Admin

    Ton dernier code est correct

    le 28/09/2022 à 09h19

  • nerlinedu82-45

    nerlinedu82-45

    Bonjour pourriez-vous me dire ce qui ne va pas merci d'avance <!DOCTYPE html> <html> <head> <title></title> </head> <body> <img src="https://cdn.futura-sciences.com/cdn-cgi/image/width=1760,quality=60,format=auto/sources/images/diaporama/2224_-_Serpents_/11%20fs-Opayaza.jpg"/> <a herf="https://www.futura-sciences.com/planete/photos/biodiversite-attention-serpents-venimeux-pas-gardez-votre-sang-froid-2224/serpent-trimeresurus-insularis-petite-vipere-bleue-16714/"> <img src="https://sain-et-naturel.ouest-france.fr/wp-content/uploads/2020/10/vipere-velue-1.jpg"/> </a> </body> </html>

    le 27/09/2022 à 13h49

  • Patricio M

    Patricio M Admin

    c'est HREF et non HERF. Vous avez deux images dans le même <a>

    le 28/09/2022 à 09h24

  • judithblot-93

    judithblot-93

    Vous ne devez avoir qu'une seule ligne de texte cliquable.

    le 23/09/2022 à 07h37

  • Patricio M

    Patricio M Admin

    Judith, je te laisse ce site pour lire la documentation et bien comprendre comment écrire un lien clickeable https://developer.mozilla.org/fr/docs/Web/HTML/Element/a

    le 23/09/2022 à 08h08

index.html
<!DOCTYPE html> <html> <head> <title></title> </head> <body> </body> </html>