Exercice 11/14
Ajoutez une seconde image au-dessous de la première. (Assurez-vous de l'ajouter avant la balise fermante </body> !).
Si vous n'avez pas d'idée, vous pouvez utiliser la photo du collègue de Tim :
https://upload.wikimedia.org/wikipedia/commons/thumb/a/a5/Robert_Cailliau_On_Desk.jpg/220px-Robert_Cailliau_On_Desk.jpg
Leçon 11/14
Une page web avec des liens c'est bien, mais une page avec des images c'est encore mieux !
C'est la balise <img> qui permet d'insérer une image : mais encore faut-il lui indiquer quelle image... Pour cela cette balise admet un attribut appelé src.
De la même façon que l'attribut href contient l'adresse de la page cible du lien dans une balise <a>, la valeur donnée à l'attribut src permet de déterminer la source de l'image. On l'écrit selon ce principe :
<img src = "" />
Remarquez qu'il n'y a pas besoin de balise jumelle pour la fermer car la balise <img> ne sert pas à encadrer une portion de texte mais représente un objet. C'est pour cette raison qu'on l'appelle auto-fermante et qu'elle se termine par />.
Regardez la balise <img> dans la fenêtre de droite. Elle permet de faire apparaître la photo du coupable (celui à cause de qui vous êtes en train de lire ce tutoriel, j'ai nommé Sir Tim Berners-Lee).
Entre les guillemets figure l'adresse de l'image sur le World Wide Web (son URL pour Uniform Resource Locator) : https://people.rit.edu/meb5367/105/project02/images/berners_lee_3.jpg. C'est grâce à cette adresse que votre navigateur est capable d'afficher l'image et c'est encore à cause du monsieur en photo qu'elle commence par "hachetétépéess deuxpoints slash slash ". Merci Tim.
Toutes les ressources disponibles sur internet ont une URL : pour l'obtenir, il suffit de faire clic-droit sur l'image, de choisir Copier l'adresse de l'image puis de la coller entre les guillemets de l'attribut src=""
_
C'est juste le principal inventeur du web !
_
305 Commentaires
-
mitrachealessandra-11
Bonjour, il m'est impossible d'ajouter le lien donné dans l'exercice. Pour que mon code fonctionne correctement il faut que je laisse les deux photos de Tim Berners-Lee. Quand j'essaie de mettre différentes images (je sais qu'il en faut seulement deux), mon code est incorrect. Pourquoi ? Merci d'avance !le 01/02/2023 à 12h18
-
Patricio M Admin
Ton dernier code est correct
le 01/02/2023 à 15h37
-
kitajulienne-94
Il veut juste qu'il y ait 2 lignes par 3 mais c'est vrai que ce n'est pas très clair...le 25/03/2022 à 14h33
-
meriam Admin
Bonjour, il suffit d'avoir deux images.
le 28/03/2022 à 14h22
-
kitajulienne-94
Il veut juste qu'il y ait 2 lignes par 3 mais c'est vrai que ce n'est pas très clair...le 25/03/2022 à 14h33
-
meriam Admin
Bonjour, l'élément body doit contenir deux images seulement.
le 28/03/2022 à 09h06
-
daunay.sandrine-12
Je ne comprends la q11 il me dit que je dois avoir 2 balises?????le 09/03/2022 à 15h51
-
meriam Admin
Bonjour, il suffit d'avoir deux images dans body
le 16/03/2022 à 13h54
-
dupin.mathieu-47
Bonjour, rien ne se passe quand je clique sur "Soumettre". Votre site semble mal fonctionner, à plusieurs reprises j'ai des messages d'erreur lors de la soumission (avec un code correct) et je dois cliquer sur le bouton de nombreuses fois pour que mon exercice soit bien validé...le 24/01/2022 à 11h14
-
meriam Admin
Bonjour, le problme est résolu. Merci pour votre compréhension.
le 25/01/2022 à 09h42
-
petrovpro33-26
<!DOCTYPE html> <html> <head> <title></title> </head> <body> <img src=https://lofficiel.imgix.net/production/belgium/images/1605173554361458-leonardo-dicaprio-young-photos-annie-leibovitz.jpg?w=802&h=720&fit=clip&auto=%5B%22format%22%2C%20%22compress%22%5D&cs=srgb&crop=faces <img src=https://lofficiel.imgix.net/production/belgium/images/1605173554361458-leonardo-dicaprio-young-photos-annie-leibovitz.jpg?w=802&h=720&fit=clip&auto=%5B%22format%22%2C%20%22compress%22%5D&cs=srgb&crop=faces </body> </html> il ya 2 images uniquement dans la partie body ! et ils me disent ne pas modifierle 13/01/2022 à 12h42
-
meriam Admin
Bonjour, vous n'avez pas fermé la balise img.
le 13/01/2022 à 13h19
-
severine.bruchon-46
Il y a un s en trop à l'extension de la 2eme image, au lieu de jpg il est écrit jpgsle 12/01/2022 à 10h46
-
meriam Admin
Bonjour, quelle est votre question exacetement ??
le 12/01/2022 à 11h24
-
louisebrunet1-50
Bonjour, je ne comprends pas ce qui bloque, on m'indique "vous devez avoir deux img dans body". Il me semble l'avoir fait convenablement. Pouvez vous m'aider svp?le 25/11/2021 à 09h04
-
meriam Admin
Bonjour, l'exercice contient par défaut deux images, vous pouvez les supprimer et ajoutez les images que vous voulez.
le 28/11/2021 à 23h19
-
jonathan-7893-71
Bonjour, j'ai le même soucis que certains, " Vous ne devez pas modifier le code de la balise <img> d'origine." alors que j'ai bien deux images et suivi l"exemple.le 01/11/2021 à 12h30
-
meriam Admin
Bonjour, supprimer l'image que vous avez ajouté, l'élément body doit contenir deux images.
le 08/11/2021 à 00h30
-
modena59-98
bonsoir, impossible de valider l'exercice, j'ai bien insérer l'image avant la première image, ça ne marche pas (dans le code d'origine, il y a déjà 2 images)<!DOCTYPE html> <html> <head> <title></title> </head> <body> <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/a/a5/Robert_Cailliau_On_Desk.jpg/220px-Robert_Cailliau_On_Desk.jpg"/> <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/3/3a/Tim_Berners-Lee_closeup.jpg/800px-Tim_Berners-Lee_closeup.jpg" /> <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/3/3a/Tim_Berners-Lee_closeup.jpg/800px-Tim_Berners-Lee_closeup.jpgs" /> </body> </html>le 31/10/2021 à 22h30
-
meriam Admin
Bonjour, l'élément body doit contenir deux images uniquement.
le 08/11/2021 à 00h09
-
modena59-98
Bonsoir, impole 31/10/2021 à 22h28
-
meriam Admin
l'élément body doit contenir deux images uniquement.
le 08/11/2021 à 00h03
-
youssouph82-51
pourquoi, on me dit que vous ne devez pas modifier la balise <img> d'origine. A quel moment l'ai-je modifié? mercile 27/08/2021 à 23h55
-
meriam Admin
Bonjour, la partie body doit contenir deux images uniquement.
le 30/08/2021 à 00h07
-
youssouph82-51
Bonjour,le 27/08/2021 à 23h53
-
ABRILCarmen
Bonjour, je ne comprends pas le problème, j'ai bien mis deux images, j'ai vérifiée mon code et tout m'a l'air correct mais le message de" vous ne devez pas modifier le code de la valise <img> d'origine " ce cesse d'apparaitre. mon code st <!DOCTYPE html> <html> <head> <title></title> </head> <body> <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/a/a5/Robert_Cailliau_On_Desk.jpg/220px-Robert_Cailliau_On_Desk.jpg"/> <img src="https://media-cdn.holidaycheck.com/image/upload/v1519674805/forum/cul80np08t9hfbhxnswp.jpg"/> </body> </html>le 25/08/2021 à 05h25
-
meriam Admin
Bonjour, une pae html doit avoir une seule partie body qui doit contenir tous les éléments.
le 30/08/2021 à 02h04
-
adryann.pagnymontana-36
pourquoi sa valide pas mon exercicele 28/07/2021 à 22h53
-
meriam Admin
Bonjour, la partie body doit contenir deux images uniquement.
le 29/07/2021 à 09h13
Commentaires les mieux notés