Problème lors de l'insertion d'une image

Résolu/Fermé
Utilisateur anonyme - 18 août 2014 à 19:34
 Utilisateur anonyme - 24 août 2014 à 10:57
Bonjour , j'ai décidé depuis peu de suivre les cour du site du zéro qui sont d'ailleurs excellents mais je n'arrive pas à introduire une image dans mon code html certains me disent que c'est parce que j'ai mal écrit le chemin de mon fichier je vous montre quelques screenshots de mon image et de mon code ainsi que le rendu.
Merci d'avance de votre réponse

L'image que je voudrait introduire dans la balise <img/>



Ensuite voici mon code



Et enfin voilà le rendu






Merci d'avance de vos réponses
A voir également:

9 réponses

Utilisateur anonyme
18 août 2014 à 19:37
Bonjour. On ne voit rien sur les images.
Écrivez-nous le nom de l'image et du fichier html avec leurs chemins complets, puis le code dans une balise de code html.
0
Utilisateur anonyme
18 août 2014 à 19:46
Bonjour oui en effet je croyais que l'on pouvait agrandir les image mais apparamment ...

Voilà le copier-coller de mon code


<!Doctype html>
<html>
<head>

<meta charset=utf-8/>
<title>Les images</title>
</head>


<body>
<p>Ce sont mes images</p>
<p><img src="Mangalarga_Marchador_Conformação.jpg" alt="C'est Zozor"/></p>
<h1>Les images</h1>
</body>


</html>




Voilà le chemin de mon image

C:\Users\Nico Grassetto\Pictures/Mangalarga_Marchador_Conformação.jpg


bien que j'ai un doute sur ce chemin et que je ne sache pas exactement ou trouver le chemin de mon image.


Merci d'avance de ta réponse
0
TsunaJima Messages postés 502 Date d'inscription samedi 21 septembre 2013 Statut Membre Dernière intervention 4 juillet 2021 58
Modifié par TsunaJima le 18/08/2014 à 19:50
En faite tu dois créer un dossier pour ton site web. Tu le nomme par exemple "site web". A l'intérieur tu met ton index.html et tu créer un dossier "img". Le chemin de ton img devra être simplement :"img/Mangalarga_Marchador_Conformaçao.jpg" et renomme ton image sans le â.

PS: mets ton image dans le dossier "img".
0
Utilisateur anonyme
18 août 2014 à 22:14
Re-voici ton code avec quelques corrections:
<!Doctype html> 
<html> 
	<head> 
		<meta charset=utf-8/> 
		<title>Les images</title> 
	</head> 
	<body> 
		<p>Ce sont mes images</p> 
		<img src="Mangalarga_Marchador_Conformação.jpg" alt="C'est Zozor" />
		<h1>Les images</h1> 
	</body> 
</html>

Pour information: la balise <img> n'a pas besoin d'être dans une balise <p>. Autant s'en passer pour alléger le code et donc diminuer le temps de traitement de la page.

Ton lien fait référence au fichier. Si tu ne précises pas su chemin exacte depuis la racine du disque (ou de ton hébergeur), le lien est alors relatif et commence dans le dossier ou se trouve le fichier html. Pour garder le code tel qu'il est, il te suffit de mettre l'image dans le dossier du fichier html. Si tu souhaites le mettre dans un sous-dossier, il faudra ajouter le chemin relatif à l'attribut src="".

Par exemple, tu mets l'image dans le sous-dossier "images" ce qui donne :
<img src="images/monImage.extension" alt="truc" />



0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Utilisateur anonyme
19 août 2014 à 01:00
Merci de toutes vos réponses , je vais essayer tout ça en revérifiant bien le tout après mais je viens de remarquer quelque chose , le format d'image jpg s'écrit bien comme ça ou il s'écrit jpeg ?


Encore une fois un grand merci de vos réponses
0
Utilisateur anonyme
19 août 2014 à 03:11
jpg et jpeg sont valides tous les deux. Mais tu dois mettre dans ton code HTML la même extension que le fichier que tu appelles.
0
Utilisateur anonyme
19 août 2014 à 13:25
Merci de votre réponse

Voilà j'ai fait un dossier sur mon bureau qui s'appelle "site web"
et un sous dossier qui se nomme images avec mon image à l'intérieur
et mon code dans le dossier "site web" mais qui lui n'est pas dans un sous dossier

Voilà mon code


<!DOCTYPE html>

<head>

<meta charset-utf-8/>

<title>Mon site web</title>



</head>


<body>
<h1>Le nom de la page </h1>
<h2>Le sous titre</h2>
<p>Texte ici plus tard</p>
<img src="images/Smile.jpeg" alt="C'est une image comme une autre"/>






</body>



J'ai réessayé mais ça ne marche toujours pas mais je suis presque sur que c'est moi qui n'est pas bien compris ce que vous appelez "chemin" , j'ai mis comme chemin le sous dossier et le nom de l'image mais peut être que c'est autre chose

PS : j'ai essayé sur différents navigateurs comme Internet et Google mais tout les deux ne m'affichent pas l'image .




Merci d'avance de vos réponses
0
Utilisateur anonyme
19 août 2014 à 16:15
Essayes avec un slash au début du chemin, je crois bien qu'il en faut un pour que le début du chemin soit considéré comme un sous-dossier.
0
Utilisateur anonyme
24 août 2014 à 00:02
Bonjour j'ai fais un dossier compressé qui s'affiche en zip mais comment le met-on sur CCM
0
Utilisateur anonyme
24 août 2014 à 00:19
Utilise un hébergeur de fichiers (comme free par exemple) et communique le lien de téléchargement.
0
Correction du code!

Le code d'origine (écris pas startup21) :
<!DOCTYPE HTML>
<html>
 
      <head>
   <meta charset=utf-8/>
   <title>Co gaming</title>
   
   </head>
   
            <body>
    <h1>Welcome to CO gaming</h1>
    <h2>Co world</h2>
    
    <p>This is CO world ,streams and video games</p>
    
    <p><img src="images/co logo.html" alt="c'est le logo de co world"/></p>
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      
      </body>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 </html>


L'arborescence des fichiers:
[Racine du site]
| co gaming.html
|/img
| |co_logo.png

Erreur concernant l'image: ton attribut src ne contient pas le bon chemin. Le dossier que tu utilises se nomme "img", c'est ce nom-là qui doit apparaître dans le code. Le fichier image se nomme "co_logo.png", pas co gaming.html". C'est sûr que sans le bon chemin, ça ne marche pas. Et pointer vers un fichier html dans une balise image non-plus.

Et, encore une fois: la balise <p> ne sert à rien autour d'une balise <img/>. Il vaut mieux ne pas mettre une image seule dans un paragraphe, ça allège le code et le rend plus rapide à être exécuté.

Il faut que tu indentes correctement ton code avec des tabulations (et pas autre-chose), en suivant une règle simple: 1 niveau d'indentation = 1 tabulation.

Aussi, évite de sauter des lignes inutilement. Aucun code ne doit avoir plus d'un saut de ligne sans but. Il s'agit d'économiser le moindre caractère et d'avoir un code propre, soigné et surtout lisible même à moitié endormit.

Bref, voilà ma correction (téléchargeable ici), comprenant indentation et sauts de lignes:
<!DOCTYPE HTML>
<html>

 <head>
 
  <meta charset=utf-8/>
  <title>Co gaming</title>
  
 </head>
 <body>
 
   <h1>Welcome to CO gaming</h1>
    <h2>Co world</h2>
   <p>This is CO world ,streams and video games</p>
   <img src="img/co_logo.png" alt="c'est le logo de co world"/>
   
 </body>
 
 </html>

Mes seuls saut de lignes se situent après balise ouvrante et avant balise fermante quand elles ne sont pas sur la même ligne. Ça permet aux débutants de bien repérer le début et la fin d'une balise. Rien de conventionnel, tu peux les enlever si tu préfères.

Maintenant, je crois que des mises au point s'imposent. Deux articles à lire absolument:
Règles HTML/CSS pour les débutants
Conventions et normes de codage
Ces deux-là contiennent infos pratiques pour débutant et normes/conventions. IL FAUT que tu suives tout ça. Plus que de te fournir un cadre d'apprentissage et de travail optimisé, ces notions sont internationales et doivent être utilisées par un maximum de programmeurs afin qu'on puisse tous se comprendre.

<signature title="T-T" />
0
TsunaJima Messages postés 502 Date d'inscription samedi 21 septembre 2013 Statut Membre Dernière intervention 4 juillet 2021 58
18 août 2014 à 19:40
Si ton site est déjà en ligne (sur un hébergement donc) tu dois écrire un chemin d'image du type "./images/ton-image.jpg". Si tu es sous wamp tu dois faire un chemin du type "C:/wamp/www/le-nom-de-ton-img.jpg".
-1
Utilisateur anonyme
18 août 2014 à 19:47
Non. Le choix du chemin absolu ou relatif n'est qu'une question esthétique.
0
Utilisateur anonyme
23 août 2014 à 16:52
UP
0
Utilisateur anonyme
23 août 2014 à 16:53
Je vous mets également un lien pour le même discussion mais ailleurs

https://forums.commentcamarche.net/forum/affich-30680097-projet-de-site-web#p30698655
0
Utilisateur anonyme
23 août 2014 à 17:41
@startup21: Je t'ai donné des réponses, pourquoi donc ce UP? Il y a des problèmes dont tu ne parles pas?
0
Utilisateur anonyme
23 août 2014 à 18:18
Parce que je m'en suis rendu comte après et que visiblement je ne suis pas la seul personne qui ai ce problème , de plus vous m'avez conseillé beaucoup de soluce mais aucune ne marche donc j'ai ouvert une nouvelle question (qui a un peu dévier de son sujet je l'avoue ;-) pour ne pas vous retenir de trop .
0