Partage
  • Partager sur Facebook
  • Partager sur Twitter

image sur mon site html

Image non visible

    4 avril 2020 à 13:01:36

    Bonjour à tous ! ça fait maintenant 2 jours que je cherche déespérément à insérer une image dans mon code HTML. Je prends l'image en JPG, je place les dimensions comme demandées dans le code mais je n'ai le droit qu'à un carré vide avec un icône de feuille déchirée en deux et ma photo n'apparaît donc pas.

    Comment faire selon-vous ?

     <!DOCTYPE html>
      
     <html>
    
    	<head>
    
     
     <Tit1e><font size="+5">The Darkness of the Soul</font> 
     </Tit1e>
      <meta charset = "utf/8">
        <style>
          body {
          background-color: #93B874;
          }
    	  p {
    	  background-color: #00bfff
    	  }
        </style>
     
     
     <p> <font size="+3">Jack the Ripper</font> 
      </Tit1e>
     </p>
    	</head>
     <hl> <font size="+2">The East End</h1>
      </html>
      
     <body>
     <p>
     <hl> <font size="+1">The cursed district</h1>
      </p>
      
     <img src="images/the ripper.jpg"width="221"height="335"/>
      Mitre Square
      
       <ul>
     <li><a href="https://fr.wikipedia.org/wiki/Fichier:The_Curse_Upon_Mitre_Square_title_page.jpg"/> 
    	 	
    		 </ul>
    	      	
    
    	    	         </body> 
    						 </html>
    <header> 
                    <nav>
    				
    				 <h2>1.1-Jack the Ripper</h2>
                            <a href="pages/"Jack the Ripper.html">Birth of a Myth</a>
    				 <h3>1.2-Press and Penny Dreadful</h3>
                            <a href="pages/"Press and Pennydreadul.html">The Curse upon Mitre Square</a>
    				<h2>2.1-The East End</h2>
                            <a href="pages/"The East End.html">Whitechapel</a>
    				<h2>3.1-The Ripper and the end of the East End</h2>
                            <a href="pages/"The Ripper and the end of the East End.html">William Booth</a>
                            <a href="pages/Literary works.html">Literary works</a>
                            <a href="pages/Definitions.html">Definitions</a>
                            <a href="pages/Bibliography.html">Bibliography</a>
                    </nav>		

    Merci de vos réponses :)

    -
    Edité par AbcAbc6 4 avril 2020 à 14:28:24

    • Partager sur Facebook
    • Partager sur Twitter
      4 avril 2020 à 13:40:21

      Salut

      On comprend pas grand chose à ton code. Avec quel cours codes-tu ?

      Plusieurs conseils:

      - CODE PROPREMENT( pour te faciliter à te retrouver)

      - Perso, je te conseille de créer un fichier css externe.

      - Une seule balise HTML suffit.

      - Tu mélange toutes tes balises.

      - Il n y a pas que h1 (h2, h3, h4 existe aussi) au lieu des "font size +1"

      Essaye avec ca déjà:

      <!DOCTYPE html>
        <html>
          <head>
            <Title>The Darkness of the Soul</Title>
            <meta charset = "utf/8">
              <style>
                body {
                background-color#93B874;
                }
                p {
                background-color#00bfff
                }
              </style>
          </head>

       <body>
        <hl>The East End</h1>
          <h2>The cursed district</h1>
            <p><img src="images/the ripper.jpg"width="221"height="335" alt="TheRipper"/>Mitre Square</p>
          <ul>
            <li><a href="https://fr.wikipedia.org/wiki/Fichier:The_Curse_Upon_Mitre_Square_title_page.jpg"/>
          </ul>
                      <nav>
                        <h2>1.1-Jack the Ripper</h2>
                                <a href="pages/"Jack the Ripper.html">Birth of a Myth</a>
                        <h3>1.2-Press and Penny Dreadful</h3>
                                <a href="pages/"Press and Pennydreadul.html">The Curse upon Mitre Square</a>
                        <h2>2.1-The East End</h2>
                                <a href="pages/"The East End.html">Whitechapel</a>
                        <h2>3.1-The Ripper and the end of the East End</h2>
                                <a href="pages/"The Ripper and the end of the East End.html">William Booth</a>
                                <a href="pages/Literary works.html">Literary works</a>
                                <a href="pages/Definitions.html">Definitions</a>
                                <a href="pages/Bibliography.html">Bibliography</a>
                      </nav>   
        </body>
      </html>
      • Partager sur Facebook
      • Partager sur Twitter
        4 avril 2020 à 14:25:34

        Bonjour, avant de s'occuper du problème de l'image, il y a beaucoup à dire sur ton code. cellui-ci est bourrer d'erreur que vous pouvez voir en passant votre code au validateur . => https://validator.w3.org/

        Je te recommandes vivement de suivre le cours HTML/CSS de ce site.

        La balise <font> est obsolète depuis 20 ans elle n'est pus à utiliser. C'est en CSS que l'on attribue de style. 

        Ton fichier commence par

        <!DOCTYPE html>
        <html lang="fr">

        et ce termine par

        </body>
        </html>

        il n'y a pas de dérogation possible!!

        Aucune balise d'affichage dans le <head>

        Un paragraphe contient du contenu phraser donc pas de titre au autre block.

        Il y a un espace avant chaque attribut. L33

        Il est nécessaire absolument d'indenter ton code, à la fois pour que tu t'y retrouve toi, mais également pour que les autres puissent te lire facilement.

        Il n'y a aucun sens d'indiquer une liste de chose avec une seul de ses choses. Si c'est le cas c'est qu'une liste n'est pas la balise adéquate.

        Pas d'espace dans les noms de fichier et de répertoire. "/page/" dans l'url n'apporte aucune information utile pour vos visiteurs, utiliser un nom de répertoire plus descriptif et explicatif.

        Concernant les titres une lecture : https://developer.mozilla.org/fr/docs/Web/HTML/Sections_and_Outlines_of_an_HTML5_document

        Corriger votre code et reposter le si nécessaire. On s'occupera du problème de l'affichage de l'image après.

        Tu peux t'aider également de la doc MDN HTML et CSS

        PS Je retire le mot "problème" de votre titre, en effet les titres avec problème ne sont pas tolérés.

        @DamienVerdu Bonjour, c'est bien d'aider mais en respectant les règles du forum, pour l'insertion du code merci d'utiliser l'outil d'insertion de code via le bouton code </> du forum.

        -
        Edité par AbcAbc6 4 avril 2020 à 14:34:29

        • Partager sur Facebook
        • Partager sur Twitter
          4 avril 2020 à 21:55:23

          Bonjour.

          tit1e est différent de title.

          Donc comme l'a dit Anonyme, passes ton code dans le validateur et il te faudra également suivre les cours sur le HTML, à la vue de toutes ces erreurs.

          • Partager sur Facebook
          • Partager sur Twitter

          Face a quelqu'un pour qui l'on n'éprouve que de l'aversion et du mépris, les yeux d'un homme deviennent extrêmement froids et cruels.

            5 avril 2020 à 20:13:12

            L'image ne s'affiche pas car la balise img doit toujours être à l'intérieure d'une balise donc tu pourrais faire comme ca : 

             <ul>

            </ul>
            tu as aussi oublié de fermer la balise </li>
            • Partager sur Facebook
            • Partager sur Twitter
              5 avril 2020 à 20:27:14

              h27D3 a écrit:

              L'image ne s'affiche pas car la balise img doit toujours être à l'intérieure d'une balise donc tu pourrais faire comme ca :

              Non, il est possible d' indiquer une image seul dans le body.

              Par contre si il s'agit de cette image ce n'est pas la bonne URL.

              Voici l'image https://upload.wikimedia.org/wikipedia/commons/c/cc/The_Curse_Upon_Mitre_Square_title_page.jpg

              et pas https://fr.wikipedia.org/wiki/Fichier:The_Curse_Upon_Mitre_Square_title_page.jpg qui est la page qui donne les caractéristiques de ce fichier.

              -
              Edité par AbcAbc6 5 avril 2020 à 20:27:34

              • Partager sur Facebook
              • Partager sur Twitter

              image sur mon site html

              × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
              × Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
              • Editeur
              • Markdown