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

bonjour, s'il vous plait j'ai un problème au niveau de ma page web , j'ai réalisé mon code html et je suis sur que j'ai aucune faute mais malgré ça l'image que j'ai inséré ne s'affiche pas et même chose pour l'arrière plan ou j'ai employé le code css est-ce que quelqu'un a une solution pour ce prob ?
voila mon code html

voila le résultat sur ma page web

A voir également:

Image ne s'affiche pas html
Image iso - Guide
Editeur html - Télécharger - HTML
Acronis true image - Télécharger - Sauvegarde
Faststone image viewer - Télécharger - Visionnage & Diaporama
Google recherche par image - Guide

4 réponses

Réponse 1 / 4

jordane45 Messages postés 38161 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 5 mai 2024 4 657
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... ) ?

najlanounou Messages postés 13 Date d'inscription mardi 23 avril 2019 Statut Membre Dernière intervention 28 avril 2019
24 avril 2019 à 14:15

Bonjour,
voila le code que vous m'avez demander:

<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>

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

jordane45 Messages postés 38161 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 5 mai 2024 4 657
24 avril 2019 à 15:38

https://www.google.fr/search?q=vider+le+cache+de+son+navigateur

najlanounou Messages postés 13 Date d'inscription mardi 23 avril 2019 Statut Membre Dernière intervention 28 avril 2019
24 avril 2019 à 16:00

ça ne marche toujours pas :(

Ahdjit
24 avril 2019 à 19:23

Il y a des fautes aussi:
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:

font-weight:bold;

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.

najlanounou Messages postés 13 Date d'inscription mardi 23 avril 2019 Statut Membre Dernière intervention 28 avril 2019 > Ahdjit
24 avril 2019 à 22:14

vous avez évoqué le terme DOCTYPE bah j'lai déjà utiliser mais ça ne change rien du tout, pour le ; je l'ai aussi utilisé mais ça ne donne rien aussi
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

Réponse 2 / 4

jordane45 Messages postés 38161 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 5 mai 2024 4 657
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

<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 ?

Réponse 3 / 4

telliak Messages postés 3655 Date d'inscription mercredi 20 septembre 2006 Statut Membre Dernière intervention 27 mars 2024 875
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.

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

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 38161 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 5 mai 2024 4 657 > 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

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

Réponse 4 / 4

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

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

jordane45 Messages postés 38161 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 5 mai 2024 4 657
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.....

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

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 ?

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 ?

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

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>

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 ?

Discussions similaires

Retrouver l'image originale après avoir fait des modifications ?

programme qui n'affiche pas le mot secret

Image cliquable dans html

Espace en HTML

Discussions similaires

Newsletters