insèrer une image

aidez un pauvre débutant svp

2 décembre 2021 à 15:48:02

Bonjour à tous,

Pour mettre le contexte, je suis un néophyte et j'ai jusqu' a présent quasiment compris le début du début. Trêve de plaisanteries, je me trouve actuellement et depuis quelques temps sur le chapitre "insérer une image", le soucis c'est que je ne comprend pas quel chemin dois je indiquer dans le code pour mettre une image contenue dans mon pc!? Si quelqu'un avais la gentillesse de me consacrer juste le temps de lire mon code et d me dire ou je me suis trompé, qui que vous soyez, je vous en serais reconnaissant. PS: mille pardon, je ne me suis pas présenté, je me prénomme Michaël et merci d'avance à ou aux personnes qui pourrais m'aider. Bien à vous

<!DOCTYPE html>

<html>

<head>

<title>Mon premier code</title>

</head>

<body>

<h1>Mon premier essai de codage</h1>

<p>Premier point, il est assez difficile de commencer à apprendre seul et avec pour seul proffesseur un site.</p>

<p>D'autant plus que derrière un air simple, la réalitée est tout autre.</p>

<p>Je vais donc tenter de conclure cet exercice par l'implantation d'une petite image.</p>

<p>

Voici la photo de mon bebe et du tigre:<br/>

</p>

</body>

</html>

ChrisLebure

2 décembre 2021 à 15:59:22

Bonjour,

jamais d'espace dans un nom de dossier ou autre

Ensuite, pour répondre à la question : tout dépend de la hiérarchie des dossiers et sous-dossiers,
la logique est de de se mettre à la place de la page HTML elle-même (on l'appellera index.html):

si l'image est à côté de la page index.html :

<img src="monimage.jpg" alt="mon image">

si l'image est dans un dossier "images" situé, lui, à côté de la page index.html :

<img src="images/monimage.jpg" alt="mon image">

si on a une structure de la forme :

[travail]

[images] [pages html]

monimage.jpg index.html
paysage.jpg contact.html
citations.html

c'est à dire un dossier contenant les images à côté d'un dossier contenant les pages html

<img src="../images/monimage.jpg" alt="mon image">

ici, "../" sert à remonter d'un cran dans la hiérarchie des dossiers, là on remonte dans le premier niveau du répertoire "travail"et on redescend dans le répertoire "images"

J'espère avoir été relativement clair !

un peu de doc au sujet des chemins de fichiers :

https://www.alsacreations.com/astuce/lire/78-quelle-est-la-diffrence-entre-les-chemins-relatifs-et-absolus.html

https://developer.mozilla.org/fr/docs/Learn/Getting_started_with_the_web/Dealing_with_files

-
Edité par ChrisLebure 2 décembre 2021 à 16:01:57

AbcAbc6

2 décembre 2021 à 16:11:31

Bonjour,

Le message qui suit est une réponse automatique activée par un membre de l'équipe. Les réponses automatiques leur permettent d'éviter d'avoir à répéter de nombreuses fois la même chose, ce qui leur fait gagner du temps et leur permet de s'occuper des sujets qui méritent plus d'attention.
Nous sommes néanmoins ouverts et si vous avez une question ou une remarque, n'hésitez pas à contacter la personne en question par Message Privé.
Pour plus d'informations, nous vous invitons à lire les règles générales du forum

Merci de colorer votre code à l'aide du bouton Code

Les forums d'Openclassrooms disposent d'une fonctionnalité permettant de colorer et mettre en forme les codes source afin de les rendre plus lisibles et faciles à manipuler par les intervenants. Pour cela, il faut utiliser le bouton Code de l'éditeur, choisir un des langages proposés et coller votre code dans la zone prévue. Si vous utilisez l'éditeur de messages en mode Markdown, il faut utiliser les balises <pre class="brush: xml;">Votre code ici</pre>.

Merci de modifier votre message d'origine en fonction.

Liens conseillés

MichaelHerygers

3 décembre 2021 à 11:13:55 - Message modéré pour le motif suivant : Merci d'utiliser le bouton code du forum pour insérer votre code

AbcAbc6

3 décembre 2021 à 11:44:04

Bonjour Michael,

Pourriez vous nous fournir une copie d'écran de la hiérarchie de vos fichiers?

Dans l'idéal placer les images de votre site dans un répertoire images, pour y accéder c'est le deuxième code donner par ChrisLebure.

N'indiquer pas dans le chemin c:// car quand vous uploadrez votre site sur un serveur distant c:// n'existera pas.(ce sera un système unix et pas windows)

>> PS: la demande de mettre les balises en couleur avec l'onglet code me donne une liste de propositions mais pas de html?

Il faut descendre tout en bas de la liste et choisir xhtml. (oui le forum est vieux).

Domi65

3 décembre 2021 à 11:44:44

Hello !

Logiquement, puisqu'un site est censé être déployé sur un serveur, du dois établir une petite arborescence et déposer les images qu'utilisent tes pages dans un dossier que tu peux appeler simplement images. ainsi, pour faire un lien, tu n'auras qu'à faire par exemple

<img src="images/monimage.jpg" alt="Ma belle image">

Même si tu ne fais pour le moment que des sites d'essais, prends cette habitude indispensable.