Les images et background ne s'affichent pas en html
Résolu/Fermé
najlanounou
Messages postés
13
Date d'inscription
mardi 23 avril 2019
Statut
Membre
Dernière intervention
28 avril 2019
-
23 avril 2019 à 22:53
najlanounou Messages postés 13 Date d'inscription mardi 23 avril 2019 Statut Membre Dernière intervention 28 avril 2019 - 25 avril 2019 à 17:06
najlanounou Messages postés 13 Date d'inscription mardi 23 avril 2019 Statut Membre Dernière intervention 28 avril 2019 - 25 avril 2019 à 17:06
A voir également:
- Image ne s'affiche pas html
- Le clavier de mon telephone ne s'affiche plus - Guide
- Image iso - Guide
- Editeur html - Télécharger - HTML
- Acronis true image - Télécharger - Sauvegarde
4 réponses
jordane45
Messages postés
38370
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
5 janvier 2025
4 722
23 avril 2019 à 22:57
23 avril 2019 à 22:57
Bonjour,
Pour commencer, merci de poster ton code correctement sur le forum ( en utilisant les BALISES DE CODE )
Explications disponibles ici : https://codes-sources.commentcamarche.net/faq/11288-les-balises-de-code
Ensuite,
Où se trouve l'image par rapport à ta page html ?
As tu vidé le cache de ton navigateur ?
Es-tu sûr du chemin (et du nom des fichiers en respectant scrupuleusement les majuscules/minuscules... ) ?
Pour commencer, merci de poster ton code correctement sur le forum ( en utilisant les BALISES DE CODE )
Explications disponibles ici : https://codes-sources.commentcamarche.net/faq/11288-les-balises-de-code
Ensuite,
Où se trouve l'image par rapport à ta page html ?
As tu vidé le cache de ton navigateur ?
Es-tu sûr du chemin (et du nom des fichiers en respectant scrupuleusement les majuscules/minuscules... ) ?
jordane45
Messages postés
38370
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
5 janvier 2025
4 722
24 avril 2019 à 16:04
24 avril 2019 à 16:04
Tes fichiers ne trouvent pas dans un ZIP ou une archive quelconque ?
car dans ce cas...ça ne fonctionnera pas.
Il faut bien que les fichiers soient dezippés...
Ensuite, quelle est l'url qui apparait dans ton navigateur lorsque tu affiches ton fichier html ?
As tu essayé de mettre le chemin absolu ?
Ou sinon, pour le relatif, de mettre un ./ devant le dossier image
par exemple
Peux tu également utiliser l 'inspecteur de ton navigateur (les outils de dev accessibles, en général, via la touche F12 du clavier) et pointer sur la photo dans ton code puis nous en faire une capture écran ?
car dans ce cas...ça ne fonctionnera pas.
Il faut bien que les fichiers soient dezippés...
Ensuite, quelle est l'url qui apparait dans ton navigateur lorsque tu affiches ton fichier html ?
As tu essayé de mettre le chemin absolu ?
Ou sinon, pour le relatif, de mettre un ./ devant le dossier image
par exemple
<img src="./image/photo.jpg" alt="photo"></img>
Peux tu également utiliser l 'inspecteur de ton navigateur (les outils de dev accessibles, en général, via la touche F12 du clavier) et pointer sur la photo dans ton code puis nous en faire une capture écran ?
telliak
Messages postés
3667
Date d'inscription
mercredi 20 septembre 2006
Statut
Membre
Dernière intervention
4 novembre 2024
876
24 avril 2019 à 21:48
24 avril 2019 à 21:48
Salut,
A mon avis :
l'erreur vient de l'écriture erronée de l'adresse de l'image, il faut que tu mettes url(image/cv1.jpeg) et non url(../image/cv1.jpeg).
. url(image/cv1.jpeg) va chercher l'image dans un répertoire image, dépendant de celui où est enregistré le code;
. url(../image/cv1.jpeg) va chercher l'image dans un répertoire image, frère (au même niveau) de celui où est enregistré le code.
Par ailleurs, je suis sur que j'ai aucune faute , exactement ce qu'il ne faut jamais dire, pour la bonne raison qu'une erreur est toujours possible, or, en ce qui concerne ton code les erreurs ne manquent pas :
1- tu utilises des balises périmées depuis des années, elles perdurent parce que les navigateurs ont bon caractère, mais il est incorrect et risqué de les utiliser.
2- par grandeur d'âme, les navigateurs tolèrent <body style= background-image:url(../image/cv1.jpeg)>, mais la syntaxe devrait être <body style="background-image:url(../image/cv1.jpeg); ">
3-Je ne sais pas quel est ton support d'apprentissage, mais vois plutôt ce topo.
A mon avis :
l'erreur vient de l'écriture erronée de l'adresse de l'image, il faut que tu mettes url(image/cv1.jpeg) et non url(../image/cv1.jpeg).
. url(image/cv1.jpeg) va chercher l'image dans un répertoire image, dépendant de celui où est enregistré le code;
. url(../image/cv1.jpeg) va chercher l'image dans un répertoire image, frère (au même niveau) de celui où est enregistré le code.
Par ailleurs, je suis sur que j'ai aucune faute , exactement ce qu'il ne faut jamais dire, pour la bonne raison qu'une erreur est toujours possible, or, en ce qui concerne ton code les erreurs ne manquent pas :
1- tu utilises des balises périmées depuis des années, elles perdurent parce que les navigateurs ont bon caractère, mais il est incorrect et risqué de les utiliser.
2- par grandeur d'âme, les navigateurs tolèrent <body style= background-image:url(../image/cv1.jpeg)>, mais la syntaxe devrait être <body style="background-image:url(../image/cv1.jpeg); ">
3-Je ne sais pas quel est ton support d'apprentissage, mais vois plutôt ce topo.
najlanounou
Messages postés
13
Date d'inscription
mardi 23 avril 2019
Statut
Membre
Dernière intervention
28 avril 2019
24 avril 2019 à 22:03
24 avril 2019 à 22:03
j'ai essayé tous ce que tu as dit mais ça marche toujours pas, le problème ne vient pas de l'écriture de l'adresse ni du chemin donc voila je cherche toujours d'ou vient le problème, et si par hypothèse, vous avez raison, alors comment je vais faire pour l'image qui n’apparaît pas ? est ce que le problème vient aussi de l'adresse ?
jordane45
Messages postés
38370
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
5 janvier 2025
4 722
>
najlanounou
Messages postés
13
Date d'inscription
mardi 23 avril 2019
Statut
Membre
Dernière intervention
28 avril 2019
24 avril 2019 à 22:05
24 avril 2019 à 22:05
Tu n'as pas répondu à mon précédent message....https://forums.commentcamarche.net/forum/affich-35990407-les-images-et-background-ne-s-affichent-pas-en-html#5
najlanounou
Messages postés
13
Date d'inscription
mardi 23 avril 2019
Statut
Membre
Dernière intervention
28 avril 2019
24 avril 2019 à 22:09
24 avril 2019 à 22:09
Qu'est ce que vous voulez entendre par un ZIP ??
file:///C:/Users/lenovo/Desktop/profil%201.html voila l'URL qui s'affiche lorsque je clique sur ma page web
j'ai essayé de mettre le ./ et aussi ../ mais en vain, le chemin absolu ??
d'ailleurs, j'ai remarqué que vous avez fermé la balise <img> je pense pas qu'on doit la fermer non ?
alors j'ai un Pc qui s'appelle Lenovo et donc quand je clique sur F12 c'est pour ajuster la luminosité, donc je vois pas comment faire, mais sinon j'ai cliquer droit sur le contenu de ma page web puis j'ai choisi inspecter et voila ce que ça donne
file:///C:/Users/lenovo/Desktop/profil%201.html voila l'URL qui s'affiche lorsque je clique sur ma page web
j'ai essayé de mettre le ./ et aussi ../ mais en vain, le chemin absolu ??
d'ailleurs, j'ai remarqué que vous avez fermé la balise <img> je pense pas qu'on doit la fermer non ?
alors j'ai un Pc qui s'appelle Lenovo et donc quand je clique sur F12 c'est pour ajuster la luminosité, donc je vois pas comment faire, mais sinon j'ai cliquer droit sur le contenu de ma page web puis j'ai choisi inspecter et voila ce que ça donne
jordane45
Messages postés
38370
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
5 janvier 2025
4 722
24 avril 2019 à 22:16
24 avril 2019 à 22:16
Alors c'est le bon écran... mais faudrait agrandir la zone (là où c'est en bleu clair...) pour voir le code html
Une fois la zone agrandie.. tu cherches la balises img, dans la balise tu cherches l'attribut src.. et tu survoles la valeur qui s'y trouve avec ta souris
Et puis.. là.. le chemin de ton fichier html est sur le bureau.....
Ton dossier image y est aussi ?
Car dans les images que tu nous as montré tout à l'heure...;tes fichiers se trouvaient dans un fichier rar
En plus ton fichier se nommait 'profil najla.html' ... et maintenant... 'profil 201.html'
NB: Il faut, d'ailleurs, éviter les espaces et les caractères spéciaux dans les noms de tes fichiers et de tes dossiers !
Je t'invite à placer TOUS tes fichiers directement dans un dossier à la racine de ton disque c:
par exemple, dans c:\monsite\
puis de retester.....
Une fois la zone agrandie.. tu cherches la balises img, dans la balise tu cherches l'attribut src.. et tu survoles la valeur qui s'y trouve avec ta souris
Et puis.. là.. le chemin de ton fichier html est sur le bureau.....
Ton dossier image y est aussi ?
Car dans les images que tu nous as montré tout à l'heure...;tes fichiers se trouvaient dans un fichier rar
En plus ton fichier se nommait 'profil najla.html' ... et maintenant... 'profil 201.html'
NB: Il faut, d'ailleurs, éviter les espaces et les caractères spéciaux dans les noms de tes fichiers et de tes dossiers !
Je t'invite à placer TOUS tes fichiers directement dans un dossier à la racine de ton disque c:
par exemple, dans c:\monsite\
puis de retester.....
najlanounou
Messages postés
13
Date d'inscription
mardi 23 avril 2019
Statut
Membre
Dernière intervention
28 avril 2019
24 avril 2019 à 22:31
24 avril 2019 à 22:31
j'ai agrandi la zone et j'ai survolé la valeur c'est comme ça !!
mon fichier html ainsi que mon dossier image se trouve sur le bureau
tu as dit que mon fichier s'appelle "profil 201.html" ou t'as vu ça ?
placer mes fichiers dans un dossier à la racine de mon disque c: est ce que c'est l'un de ces dossiers ?
mon fichier html ainsi que mon dossier image se trouve sur le bureau
tu as dit que mon fichier s'appelle "profil 201.html" ou t'as vu ça ?
placer mes fichiers dans un dossier à la racine de mon disque c: est ce que c'est l'un de ces dossiers ?
jordane45
Messages postés
38370
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
5 janvier 2025
4 722
>
najlanounou
Messages postés
13
Date d'inscription
mardi 23 avril 2019
Statut
Membre
Dernière intervention
28 avril 2019
24 avril 2019 à 22:42
24 avril 2019 à 22:42
Pour le nom du fichier, j'ai mal vu.
En fait c'est file:///C:/Users/lenovo/Desktop/profil 1.html
Le disque C: ... c'est le disque dur de ton ordinateur.
Celui que tu as selectionné en effet.
Ensuite.. deux soucis :
Déjà, au niveau du style... tu as un espace en trop avec le chemin de l'image.
Dans la balise <img comme tu peux le voir, le src est indiqué comme unknown...
Peux tu nous reposter ton code html complet ?
En fait c'est file:///C:/Users/lenovo/Desktop/profil 1.html
Le disque C: ... c'est le disque dur de ton ordinateur.
Celui que tu as selectionné en effet.
Ensuite.. deux soucis :
Déjà, au niveau du style... tu as un espace en trop avec le chemin de l'image.
Dans la balise <img comme tu peux le voir, le src est indiqué comme unknown...
Peux tu nous reposter ton code html complet ?
najlanounou
Messages postés
13
Date d'inscription
mardi 23 avril 2019
Statut
Membre
Dernière intervention
28 avril 2019
25 avril 2019 à 16:04
25 avril 2019 à 16:04
c'est toi qui m'as dit de soulever la valeur de src dans la balise <img> donc quand je l'ai soulevé ça donne unknown !!!
<html> <head> <title>Contact</title> <style> img ( position:absolute; left: 400px; top: 10px; ) </style> </head> <body style="background-image:url(../image/cv1.jpeg); "> <img src="image/photo.jpg" alt="photo CV" width:"150px" height:"150px"> <center><b><u><font size="6pt"color="#FFFF00">Profil:</font></u></b></center> <br> <center>Najla Rizki <br> Lotissement Erraha n°6 <br> El Jadida-Maroc <br> Tél:+212658285774 <br> E-mail: Najlarz22@gmail.com <br> </center> </body> </html>
jordane45
Messages postés
38370
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
5 janvier 2025
4 722
>
najlanounou
Messages postés
13
Date d'inscription
mardi 23 avril 2019
Statut
Membre
Dernière intervention
28 avril 2019
25 avril 2019 à 16:11
25 avril 2019 à 16:11
c'est toi qui m'as dit de soulever la valeur de src dans la balise <img> donc quand je l'ai soulevé ça donne unknown !!!
Soulevé ???? Oo .. qu'est-ce que c'est que ça ???? j'ai dit "survoler" (avec le curseur de la souris )
Quoi qu'il en soit,
je confirme que le code
<html> <head> <title>Contact</title> <style> img ( position:absolute; left: 400px; top: 10px; ) </style> </head> <body style="background-image:url(image/cv1.jpeg); "> <img src="image/photo.jpg" alt="photo CV" width:"150px" height:"150px"> <center><b><u><font size="6pt"color="#FFFF00">Profil:</font></u></b></center> <br> <center>Najla Rizki <br> Lotissement Erraha n°6 <br> El Jadida-Maroc <br> Tél:+212658285774 <br> E-mail: Najlarz22@gmail.com <br> </center> </body> </html>
est parfaitement fonctionnel.
As tu essayé de placer tes fichiers dans un dossier du disque c:\ comme je te l'avais demandé ? Tu as toujours le même souci ?
As tu vidé le cache de ton navigateur ?
24 avril 2019 à 14:15
voila le code que vous m'avez demander:
Pour ce qui est de l'image, elle se trouve dans un sous dossier qui se trouve dans le même dossier que ma page html voila:
Comment je vais faire pour vider le cache de mon navigateur ?
Eh oui je suis sur des noms des fichiers et du chemin voila vous pouvez vous assurez vous même
24 avril 2019 à 15:38
24 avril 2019 à 16:00
24 avril 2019 à 19:23
SI en HTML5 on peut se passer des guillemets ça peut poser des problèmes/
Le CSS ce sont des propriétés qui s'écrivent comme ceci:
nom-propriété:valeur;
Hors 1) vous n'indiquez pas le DOCTYPE HTML5 donc devez mettre les guillemets pour les valeurs des attributs.
2) style= background-image:url(../image/cv1.jpeg)
est faux puisqu'il n'y a pas de ';'(point-virgule) pour terminer le couple propriétés/valeurs.
Je vous recommande de mettre l'ensemble de votre CSS dans un fichier à part ou au moins dans une balise style qui est dédiée à ça: _ c'est plus clair et réutilisable facilement.
Quant aux balises font ou aux attributs color ou width, height ou n'importe quel attribut (ou balise) qui concernne la mise en page elles sont dépréciées et par là même à éviter depuis plus de 10 ans.
Il faut tout faire en CSS qui à l'avantage d'être plus performant, simple et clair à écrire/lire/modifier et utiliser.
Par exemple au lieu de <b> qui ne veut rien dire et n'est pas à utiliser pour mettre un texte en bas de casse(ou gras) il faut simplement indiquer la règle suivante:
Explication détaillée:
Note: According to the HTML 5 specification, the <b> tag should be used as a LAST resort when no other tag is more appropriate. The HTML 5 specification states that headings should be denoted with the <h1> to <h6> tags, emphasized text should be denoted with the <em> tag, important text should be denoted with the <strong> tag, and marked/highlighted text should use the <mark> tag.
Tip: You can also use the CSS "font-weight" property to set bold text.
source: https://www.w3schools.com/tags/tag_b.asp
Une bonne chose à moins d'utiliser le DOCTYPE transitional qui n'est pas vraiment pratique.
24 avril 2019 à 22:14
j'ai aussi essayé de mettre l'ensemble dans un autre fichier CSS mais ça ne fonctionne tjr pas
et pour le <b> je ne vois pas pourquoi je dois le changer ça cause aucun prob