Partage
  • Partager sur Facebook
  • Partager sur Twitter

Ancrage et d'insertion d'images

Un echec total.

Sujet résolu
    21 septembre 2022 à 1:35:37

    Bonjour,

    Je viens vers vous donc concernant les ancrages (pour aller directement par exemple en bas de la page) et les insertions d'images.

    J'ai beau avoir suivi le cours Apprenez à créer votre site web avec HTML5 et CSS , je n'arrive pas a les rendre fonctionnels.

    Pour ma décharge la page se complique (pour mon petit niveau débutant) et les noms d'ancre ne sont pas évident a trouver pour qu'il soit simples et significatifs.

    J'ai repris les trames du cours et veut mettre des commentaires sur mon expérience.

    Je pose le code ci-dessous.

    Si je m'y prend mal pour poster sur ce forum n'hésitez pas a m'expliquer pour que je puisse rentrer dans les clous, merci d'avance =D:

    Je voudrais faire des ancrages entre chaque sous titre ( h3). Tout cela en html.

    Mon image ne fonctionne pas. (image sur le bureau dans un dossier nommé mes premières pages web, dans le sous dossier images, image nommée Jbdevs.jpeg) pour les détails fichiers.

    détails du code: <img src="images/Jbdevs.jpeg" alt="photo jerome" />
    


    Merci d'avance pour votre aide et vos explications je code depuis le début de semaine ^^.

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="utf-8" />  
            <link rel="stylesheet" href="style.css" />     
             <title>JbDevs: Bienvenu sur ma première page web</title>
        </head>
       	<body>
    <!--les propositions de sublime texte sont avec le code complet -->
    <h1>Bonjour à tous, et bienvenu sur mon site !</h1>
    <p>
        Je suis Jérôme B et pour le moment j'apprends comment coder en html dans le but de devenir développeur !<br />
    C'est un plaisir de vous accueillir sur ma 1ère page =D <br/>
          <img src="images/Jbdevs.jpeg" alt="photo jerome" />
    
    </p>
    
    <h2><u>Comment cela va se dérouler</u> ?</h2>
    <ol>
        <li><strong>Découvrir</strong> le fonctionnement des sites web</li>
        <li><strong>Créer</strong> ma première page web en HTML</li>
        <li><strong>Organiser</strong> mon texte</li>
        <li><strong>Pratiquer</strong> !</li>
        <li><strong>Créer</strong> des liens, des images</li>
        <li><strong>M'entraîner</strong> en structurant mon CV</li>
    </ol>
    Formation sur le site <a href="https://openclassrooms.com/fr/courses/1603881-apprenez-a-creer-votre-site-web-avec-html5-et-css3">Openclassrooms</a>
    
    <h2><u>Objectifs pédagogiques</u>:</h2>
    <p>A la fin de ce cours, je devrais être capable de:</p>
     <ul>
       <li><a href="#Utiliser_du_code_HTML">Utiliser du code HTML</a></li>
       <li>Structurer une page web en HTML</li>
       <li>Utiliser du code CSS</li>
       <li>Mettre en forme une page web en CSS</li>
       <li>Organiser les éléments d’une page web grâce au CSS</li>
       <li>Modifier l'agencement d'une page HTML avec CSS</li>
       <li>Intégrer des formules dans une page web</li>
       <li>Adapter une page pour les petites résolutions en CSS</li>
    
     </ul>
    
    
       <p>Je vous créé un lien pour m'entrainer sur <a href="ma 2ème page web.html">ma 2ème page web</a></p>
    <p>L'important c'est de pratiquer, pour apprendre il n'y a pas 50 solutions pour acquerir le b.a.-ba et faire mes premiers pas sur le développement.</p>
    
    <p>Du texte du texte et encore du texte</p>
    <p>Du texte du texte et encore du texte</p>
    <p>Du texte du texte et encore du texte</p>
    <p>Du texte du texte et encore du texte</p>   
    <p>Du texte du texte et encore du texte</p>
    <p>Du texte du texte et encore du texte</p>
    <p>Du texte du texte et encore du texte</p>
    <p>Du texte du texte et encore du texte</p>   
    <p>Du texte du texte et encore du texte</p>
    <p>Du texte du texte et encore du texte</p>
    <p>Du texte du texte et encore du texte</p>
    <p>Du texte du texte et encore du texte</p>   
    <p>Du texte du texte et encore du texte</p>
    <p>Du texte du texte et encore du texte</p>
    <p>Du texte du texte et encore du texte</p>
    <p>Du texte du texte et encore du texte</p>
    <p>Du texte du texte et encore du texte</p>
    <p>Du texte du texte et encore du texte</p>
    <p>Du texte du texte et encore du texte</p>
    <p>Du texte du texte et encore du texte</p>   
    <p>Du texte du texte et encore du texte</p>
    <p>Du texte du texte et encore du texte</p>
    <p>Du texte du texte et encore du texte</p>
    <p>Du texte du texte et encore du texte</p>
    <p>Du texte du texte et encore du texte</p>
    <p>Du texte du texte et encore du texte</p>
    <p>Du texte du texte et encore du texte</p>
    <p>Du texte du texte et encore du texte</p>   
    <p>Du texte du texte et encore du texte</p>
    <p>Du texte du texte et encore du texte</p>
    <p>Du texte du texte et encore du texte</p>
    <p>Du texte du texte et encore du texte</p>
    
    
    
    
    
    
    
    
    
    
    
    
    
         <h3> id="Utiliser_du_code_HTML">Utiliser du code HTML</h3>
    <!--je veux faire une ancre vers chaque parties ci-dessus -->



    -
    Edité par JeromeBri1 21 septembre 2022 à 1:45:59

    • Partager sur Facebook
    • Partager sur Twitter
      21 septembre 2022 à 7:42:29

      Bonjour,

      pour les ancres, relis attentivement le cours, et notamment cet exemple d'ancre. Tu vas voir la petite erreur que tu as faite (compare avec ta ligne 92).

      Pour les images : tu dis

      > image sur le bureau dans un dossier nommé mes premières pages web, dans le sous dossier images, image nommée Jbdevs.jpeg

      Est-ce que le fichier html est aussi dans "mes premières pages web" ? Si oui, peux-tu une capture d'écran de ce dossier ainsi du dossier images ? Si tu es sous Windows, as-tu affiché les extensions de fichier ?

      • Partager sur Facebook
      • Partager sur Twitter

      Pas d'aide concernant le code par MP, le forum est là pour ça :)

        22 septembre 2022 à 22:47:00

        Bonsoir,

        Merci pour la réponse !

        Cependant le liens n'est pas fonctionnel ^^.

        Je vais revérifier cette horrible ligne 92 ^^, j'ai aussi essayé sans les tirets du bas ( 8) cela n'a rien changé.

        Je mets un screen de mon dossier ci-dessous.

        Merci d'avance !


        Je ne pense pas qu'il y est les extensions fichiers le chemin serait peut être plus clair.

        -
        Edité par JeromeBri1 22 septembre 2022 à 23:00:04

        • Partager sur Facebook
        • Partager sur Twitter
          22 septembre 2022 à 22:54:06

          bonsoir,

          l'affichage des extensions est désactivés sinon tu le verrais à la suite de tes pages

          prends la bonne habitude de ne pas mettre d'accent, ni d'espace dans le nom de tes fichiers

          peut-on avoir un screen du dossier images ?

          • Partager sur Facebook
          • Partager sur Twitter
            22 septembre 2022 à 23:14:01

            Voila pour le dossier image ( c'est moi oui oui je sais ça fait peur ^^)
            • Partager sur Facebook
            • Partager sur Twitter
              22 septembre 2022 à 23:18:37

              vu que l'affichage des extensions n'est pas activé, je pense que ton image se nomme "Jbdevs.jpeg.jpeg"

              clic droit propriétés pour vérifier

              • Partager sur Facebook
              • Partager sur Twitter
                22 septembre 2022 à 23:21:02

                Bonsoir et merci !!

                J'ai changé mes lignes de code et tenté de mettre du plus simple mais ca n'a rien changé.

                ligne 32 <li><a href="#utiliser1">Utiliser du code HTML</a></li>

                 ligne 92 <h3> id="utiliser1">Utiliser du code HTML</h3>


                Plus de petit lien pour insérer le code...

                • Partager sur Facebook
                • Partager sur Twitter
                  22 septembre 2022 à 23:24:06

                  ton id est en-dehors de la balise h3
                  • Partager sur Facebook
                  • Partager sur Twitter
                    22 septembre 2022 à 23:30:59

                    Merci encore !

                    Pour le liens photos en effet, c'était bien les extensions cachées...

                    La photo est énorme par contre on voit le haut de la photo, je ne montre pas mon visage en gros plan.

                    Ce n'est pas utile^^

                    -
                    Edité par JeromeBri1 22 septembre 2022 à 23:31:19

                    • Partager sur Facebook
                    • Partager sur Twitter
                      22 septembre 2022 à 23:35:43

                      a toi de la redimensionner en css ou d'avoir une version plus légère pour utiliser moins de ressources
                      • Partager sur Facebook
                      • Partager sur Twitter
                        22 septembre 2022 à 23:51:32

                        Aurélien10! a écrit:

                        ton id est en-dehors de la balise h3

                        Houlà ! J'ai mis le temps a comprendre !!!! Je comprends vite mais il faut m'expliquer longtemps...

                        Je me demande quand je fais des plans comme ça si si je peux arriver à devenir développeur moi x).

                        <h3> id="utiliser1">Utiliser du code HTML</h3>

                        <h3 id="utiliser1">Utiliser du code HTML</h3>

                        Ca marcheee !!

                        J'ai regardé x fois sans voir de différences !!!

                        J'ai du coup trouvé une ancre plus simple donc avec les numéros !

                        Merci, ah ces débutants alors ^^ ;-) heureusement sont peut-être pas tous comme moi je vais me pencher sur la taille de ma photo...

                        Je crois qu'il en parle dans le cours quand il fait la mini photo je pourrais probablement m'en inspirer pour la modifier !

                        Eh oui cette petit coquine de balise aussi la ^^.

                        Voilà tout codé mes ancres !!

                        Elles marchent toutes cette fois ;-)


                        Aurélien10! a écrit:

                        bonsoir,

                        l'affichage des extensions est désactivés sinon tu le verrais à la suite de tes pages

                        prends la bonne habitude de ne pas mettre d'accent, ni d'espace dans le nom de tes fichiers

                        peut-on avoir un screen du dossier images ?


                        J'en prends note 1000 merci à tous !!!





                        -
                        Edité par JeromeBri1 23 septembre 2022 à 1:15:23

                        • Partager sur Facebook
                        • Partager sur Twitter
                          23 septembre 2022 à 0:10:15

                          c'est comme cela que l'on apprends

                          bonne continuation et n'oublie pas de passer le sujet en résolu (bouton en haut a droite de ton 1er post)

                          • Partager sur Facebook
                          • Partager sur Twitter
                            23 septembre 2022 à 16:53:12

                            Aurélien10! a écrit:

                            c'est comme cela que l'on apprends

                            bonne continuation et n'oublie pas de passer le sujet en résolu (bouton en haut a droite de ton 1er post)

                            Bonjour,

                            Ah oui merci encore !

                            En effet je n'avais pas vu ce bouton ;-).
                            • Partager sur Facebook
                            • Partager sur Twitter

                            Ancrage et d'insertion d'images

                            × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
                            • Editeur
                            • Markdown