Problème de galerie d'images en HTML

Résolu/Fermé

Lacapucine Messages postés 1 Date d'inscription dimanche 10 octobre 2010 Statut Membre Dernière intervention 10 octobre 2010 - 10 oct. 2010 à 00:15
bg62 Messages postés 23664 Date d'inscription samedi 22 octobre 2005 Statut Modérateur Dernière intervention 17 décembre 2024 - 14 oct. 2010 à 09:54

Bonjour,
Je viens de lire un tutoriel pour faire une galerie d'images et tout allait bien jusqu'à ce que je m'aperçoive que l'image en taille normale ne s'affichait pas (rectangle avec un petit carré blanc avec un "X" rouge dessus, bref, un truc qui cloche...) et que, lorsque je cliquais sur les images miniatures, j'arrivais sur une page blanche qui m'indiquait que la page n'avait pas été trouvée.

J'avoue ne pas avoir un bon niveau en codage HTML et CSS, mais j'aimerais beaucoup votre aide .

Merci d'avance et si vous voulez d'autres précisions, vous n'avez qu'à demander

Voici le fichier HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
   <head>
       <title> Y S A L Y S</title>
       <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
	   <link rel="stylesheet" media="screen" type="text/css" title="Design" href="../essaiedesigncsst.css" />
	   <script type="text/javascript" src="script.js"></script>
   </head>
 
   <body>
  <div class="border">
       <!-- L'en-tête -->
 
       <div id="en_tete">
           
       </div>
 
       <!-- Les menus -->
 
<?php include("../menutribal.php"); ?>

 
        <!-- Le corps -->
 
       <div id="corps">
           <h2 class="grostitres">Des Photos inspirantes</h4> 
  <br />
    <h3 class="menudutruc">Artistes</h3>
          <ul>
   <a href="#mardi love"><li>Mardi Love</li></a>

</ul>

<div id="galerie">     <ul id="galerie_mini">         
<li><a href="photo/mardi.png" title="Patente"><img src="miniphoto/mardimini.png" alt="Le titre de la photo 1" /></a></li>          
<li><a href="photo/mardi2.png" title="Titre de la photo 2"><img src="miniphoto/mardi2mini.png" alt="Le titre de la photo 2" /></a></li>         
<li><a href="photo/mardi3.png" title="Titre de la photo 3"><img src="miniphoto/mardi3mini.png" alt="Le titre de la photo 3" /></a></li>         
<li><a href="photo/mardi4.png" title="Titre de la photo 4"><img src="miniphoto/mardi4mini.png" alt="Le titre de la photo 4" /></a></li>          
<li><a href="photo/mardi5.png" title="Titre de la photo 5"><img src="miniphoto/mardi5mini.png" alt="Le titre de la photo 5" /></a></li>         
<li><a href="photo/mardi6.png" title="Titre de la photo 6"><img src="miniphoto/mardi6mini.png" alt="Le titre de la photo 6" /></a></li>         
<li><a href="photo/mardi7.png" title="Titre de la photo 7"><img src="miniphoto/mardi7mini.png" alt="Le titre de la photo 7" /></a></li>          
<li><a href="photo/mardi8.png" title="Titre de la photo 8"><img src="miniphoto/mardi8mini.png" alt="Le titre de la photo 8" /></a></li>         
 </ul>           
<dl id="photo">         <dt>Titre de la photo 1</dt>         <dd><img id="big_pict" src="photo/mardi.png" alt="Photo 1 en taille normale" />     </dl> </div> 
		   <br />
		   <br />
		   		   <br />
		   <br />		   <br />
		   		   <br />
		   <br />
		   <br />
		   <br />
       </div>
 </div>
       <!-- Le pied de page -->
 
       <div id="pied_de_page">
           <p>Copyright "Ysalys" Tous droits réservés<br />
		   Toute reproduction totale ou même partielle est interdite. </p>
       </div>

   </body>
</html>

/code

A voir également:

Problème de galerie d'images en HTML
Galerie photo en ligne gratuite - Guide
Editeur html - Télécharger - HTML
Des images - Guide
Images enregistrées - Forum Blender
Comment dissocier google photo de la galerie - Forum Samsung

4 réponses

Réponse 1 / 4

prob
10 oct. 2010 à 02:06

Salut,
Vérifiez l'url(adresse) de l'image indiqué pour les(chaque) liens:

<a href="photo/mardi2.png" title="Titre de la photo 2"><img src="miniphoto/mardi2mini.png" alt="Le titre de la photo 2" /></a>

href="photo/mardi2.png"est l'attribut de la balise <a></a>(a pour anchor , ancre ou plutôt lien en bon français) qui indique où doit pointer le lien.
Donc dans notre cas il faut partir de l'endroit où se trouve la page html et se rendre au dossier "photo" pour charger l'image "mardi2.png"

Donc si à l'endroit où se trouve la page html(dossier appelé racine du site puisque tout part de là) il n'y a pas un dossier nommé "photo" qui contient l'image "mardi2.png" il ne trouvera tout simplement aucune image. Idem pour la suite.

Voir un tutoriel sur le hmtl et/ou la description de chaque balise sur internet, il y en a un paquet.

Réponse 2 / 4

bg62 Messages postés 23664 Date d'inscription samedi 22 octobre 2005 Statut Modérateur Dernière intervention 17 décembre 2024 2 392
10 oct. 2010 à 12:02

rectangle avec un petit carré blanc avec un "X" rouge dessus, bref, un truc qui cloche...

donc : erreur dans les liens ou images qui ne sont pas en ligne !!! (obligatoire!!!)

Réponse 3 / 4

Lacapucine
14 oct. 2010 à 01:12

OMG! Seigneur je viens de comprendre!
Ça fait plusieurs fois que je vérifie et ça vient de me sauter au visage!

Je les avais enregistrées en .jpg!

Merci beaucoup, ça marche ;)

Réponse 4 / 4

bg62 Messages postés 23664 Date d'inscription samedi 22 octobre 2005 Statut Modérateur Dernière intervention 17 décembre 2024 2 392
14 oct. 2010 à 09:54

ouf !
donc 'résolu' :-)

Discussions similaires

calcule nombre des pixels "noir" dans un image (noir/blanc)

Dissocier les photos de ma galerie sur Google Photos

la balise ou

Espace en HTML

ou ou