Menu

Les images et background ne s'affichent pas en html [Résolu]

Messages postés
13
Date d'inscription
mardi 23 avril 2019
Statut
Membre
Dernière intervention
28 avril 2019
- - Dernière réponse : 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
Afficher la suite 

Votre réponse

4 réponses

Messages postés
25607
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
25 mai 2019
1622
0
Merci
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
-
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
25607
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
25 mai 2019
1622 -
najlanounou
Messages postés
13
Date d'inscription
mardi 23 avril 2019
Statut
Membre
Dernière intervention
28 avril 2019
-
ça ne marche toujours pas :(
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 -
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
Commenter la réponse de jordane45
Messages postés
25607
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
25 mai 2019
1622
0
Merci
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 ?
Commenter la réponse de jordane45
Messages postés
3409
Date d'inscription
mercredi 20 septembre 2006
Statut
Membre
Dernière intervention
24 mai 2019
590
0
Merci
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
-
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
25607
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
25 mai 2019
1622 > najlanounou
Messages postés
13
Date d'inscription
mardi 23 avril 2019
Statut
Membre
Dernière intervention
28 avril 2019
-
Commenter la réponse de telliak
Messages postés
13
Date d'inscription
mardi 23 avril 2019
Statut
Membre
Dernière intervention
28 avril 2019
0
Merci
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
25607
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
25 mai 2019
1622 > najlanounou
Messages postés
13
Date d'inscription
mardi 23 avril 2019
Statut
Membre
Dernière intervention
28 avril 2019
-
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
-
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
25607
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
25 mai 2019
1622 > najlanounou
Messages postés
13
Date d'inscription
mardi 23 avril 2019
Statut
Membre
Dernière intervention
28 avril 2019
-
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 ?
najlanounou
Messages postés
13
Date d'inscription
mardi 23 avril 2019
Statut
Membre
Dernière intervention
28 avril 2019
-
comment ça survoler ?

eh bien oui j'ai essayé mais malheureusement ça ne marche pas, j'ai aussi vidé le cache de mon navigateur enfin même prob :(
najlanounou
Messages postés
13
Date d'inscription
mardi 23 avril 2019
Statut
Membre
Dernière intervention
28 avril 2019
-
bon j'ai refait le travail à zéro et ça a marché merci beaucoup pour vos conseils :)
Commenter la réponse de najlanounou