Partage
  • Partager sur Facebook
  • Partager sur Twitter

L'image ne s'affiche pas en html

Sujet résolu
26 février 2015 à 17:26:15

Bonjour à tous,

je suis inscrite sur l'openclassroom depuis peu pour le cours htlm / css et le premier exercice que Matthieu demande de réaliser est un CV, en html, simple quoi. Tout fonctionne pour moi, sauf l'affichage de ma miniature en haut de la page html et de son agrandissement lorsqu'on clique dessus. Il faut l'envoyer en zip afin que l'exercice puisse être corrigé, donc je pense qu'il y a un bins avec mon chemin...

Ca fait deux jours que je réécris le code pour l'image, en vain. J'ai essayé ce qui se disait dans les forums, mais j'crois qu'il va falloir me réexpliquer deux-trois choses !

Je vous envoie les liens de la page, si jamais vous voyez plus clairement que moi d'où ça pourrait venir! 

file:///C:/Users/Myl%C3%A8ne/AppData/Local/Temp/Temp2_cvmylene.zip/cvmylene.html => dans le ficher compressé

file:///C:/Users/Myl%C3%A8ne/Documents/mooc/cvmylene.html => en local

Merci d'avance

  • Partager sur Facebook
  • Partager sur Twitter
26 février 2015 à 17:31:22

Bonjour, nous aurions bien du mal à lire le code qui est sur ta machine!! Donne nous ton code en cliquant sur le bouton code </> et en choisissant le bon langage.
  • Partager sur Facebook
  • Partager sur Twitter
26 février 2015 à 17:34:03

J'ai exactement le même problème. Je respecte pourtant scrupuleusement le code (nom du fichier image.jpg, situé dans le même répertoiore que le fichier html). Les forums ne me disent rien de plus.
  • Partager sur Facebook
  • Partager sur Twitter
26 février 2015 à 17:38:41

Bonjour,

Comment le grand Casper l'a dit, il faut nous montrer du code, on est pas des devins et on pourra pas vous aider sans.

  • Partager sur Facebook
  • Partager sur Twitter
Voir une araignée c'est rien ... Le pire c'est quand tu ne la vois plus !
2 mars 2015 à 16:40:32

Oui, bien sûr, pas de code, pas de possibilité de réponse : on voit bien là à quel point je suis débutante ;)
Voici:
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>CV Mylène C</title>
</head>
    <body>
    <p>
<h1>Mylène C</h1>
<p><a href="cvmylene.zip/IMG_0571.jpg"><img src="cvmylene.zip/mini_IMG_0571.jpg" alt="Photo de Mylène pour le CV" title="Cliquez dessus pour l'agrandir"! /></a></p>
  • Partager sur Facebook
  • Partager sur Twitter
2 mars 2015 à 16:49:57

Bonjour mylenec,

Ici le probleme c'est que votre href pointe sur un zip, et l'html ne peut pas aller chercher une image dans un zip, il va falloir la mettre dans un dossier.

Pensez a utiliser les balises de code </> (deuxieme en partant de la droite ) vous choisissez votre langage, et vous copier coller le code dans le cadre, puis inserer.

Votre code devrais donner :

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>CV Mylène C</title>
</head>
    <body>
    <p>
<h1>Mylène C</h1>
<p><a href="monDossier/IMG_0571.jpg"><img src="monDossier/mini_IMG_0571.jpg" alt="Photo de Mylène pour le CV" title="Cliquez dessus pour l'agrandir"! /></a></p>



-
Edité par Hsuissia 2 mars 2015 à 16:51:53

  • Partager sur Facebook
  • Partager sur Twitter
Voir une araignée c'est rien ... Le pire c'est quand tu ne la vois plus !
2 mars 2015 à 18:05:50

Ok je ne savais pas pour le zip. Mais du coup si on veut envoyer le doc à quelqu'un, quel chemin faut-il indiquer?

Je viens de mettre le fichier cvmylene.html, l'image et sa miniature dans un dossier "dossiermooc" qui se situe déjà dans un dossier appelé "mooc" lui-même étant dans "Mes Documents", dans l'utilisateur Mylène.

Ca ne fonctionne toujours pas...

Voilà ce que ça donne en html:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>CV Mylène C</title>
		
    
	</head>

    <body>
    <p>
	<h1>Mylène C</h1>
		<p><a href="dossiermooc/IMG_0571.jpg"><img src="dossiermooc/mini_IMG_0571.jpg" alt="Photo de Mylène pour le CV" title="Cliquez dessus pour l'agrandir"! /></a></p>



  • Partager sur Facebook
  • Partager sur Twitter
2 mars 2015 à 18:13:48

Salut,

Si ta page et ton image sont dans le même dossier, alors il te suffit d'indiquer le nom du fichier. Le chemin relatif commence à partir de ton fichier html. S'il s'agit du même dossier, il n'y a pas de nom de dossier à ajouter.

  • Partager sur Facebook
  • Partager sur Twitter

Il n'y a pas de mauvais navigateur, il n'y a que du mauvais code !

2 mars 2015 à 18:27:18

C'est bon, je viens de comprendre pourquoi je faisais tout ce bins...

Je voulais absolument que ce soit lisible pour qqun qui télécharge mon fichier zip! Or, il est évident que la première chose que la personne va faire est d'extraire tous les fichiers, et pourvu que le html et les deux fichiers images se trouvent dans le même dossier, tout ira bien et la page html s'affichera normalement, avec la miniature cliquable et son agrandissement une fois cliquée !

MERCI BEAUCOUP casperwebHsuissia et rhooManu !

On peut maintenant fermer cette discussion, le problème est résolu une bonne fois pour toutes !

PS: c'est en faisant que l'on apprend :D

  • Partager sur Facebook
  • Partager sur Twitter
2 mars 2015 à 18:42:34

C'est pour sa qu'il est important d'utiliser les chemins relatifs pour que cela correspondent à l'architecture que tu as défini 

Normalement si tu zip cela garde la même hiérarchie que tu as défini en dezippant. Je te laisse faire le test par toi même 

Maintenant si la personne venait à changer l'image de place après le dezip il pourrait s'en prendre qu'à lui même.

Tu verras qu'en apprenant tu as une façon d'organiser son architecture. Tout le monde à sa sauce mais c'est souvent basique dans le dossier racine tu as ton html (php) puis un dossier que tu peux appeler ressources ou assets et dedans des sous dossier  :  js css et images (et autre.) cela te donne un ordre d'idée pour bien séparer tes fichier de code de tes ressources tel que images ... 

  • Partager sur Facebook
  • Partager sur Twitter
Voir une araignée c'est rien ... Le pire c'est quand tu ne la vois plus !
17 juillet 2019 à 0:30:42

sincèrement avant donner un exercice SVP expliquer comment faire avec le fichier zip!! Les videos de Mr. n'expliquent pas ça! Super diplome en 6 mois!!!
  • Partager sur Facebook
  • Partager sur Twitter

AndyParisXV

17 juillet 2019 à 6:52:27

Bonjour,

Déterrage

Citation des règles générales du forum :

Avant de poster un message, vérifiez la date du sujet dans lequel vous comptiez intervenir.

Si le dernier message sur le sujet date de plus de deux mois, mieux vaut ne pas répondre.
En effet, le déterrage d'un sujet nuit au bon fonctionnement du forum, et l'informatique pouvant grandement changer en quelques mois il n'est donc que rarement pertinent de déterrer un vieux sujet.

Au lieu de déterrer un sujet il est préférable :

  • soit de contacter directement le membre voulu par messagerie privée en cliquant sur son pseudonyme pour accéder à sa page profil, puis sur le lien "Ecrire un message"
  • soit de créer un nouveau sujet décrivant votre propre contexte
  • ne pas répondre à un déterrage et le signaler à la modération

Je ferme ce sujet. En cas de désaccord, me contacter par MP.

  • Partager sur Facebook
  • Partager sur Twitter