Vous allez apprendre à intégrer du contenu à votre site. Pour cela, vous utiliserez les balises HTML h1, h2 et une balise p, utilisée pour les paragraphes.
Les balises <h1>, <h2>, <h3> (jusqu'à <h6>), hiérarchise le contenu de votre page. La balise <p> est utilisée pour intégrer des paragraphes.
Dans cette étape, vous apprendrez à structurer votre page et à donner un sens à son contenu. La personnalisation de l'apparence de ce contenu sera expliqué dans la cinquième étape.
3.1 - Mise en place des conteneurs : balise div
Les conteneurs permettent d'intégrer un bloc dans lesquels vous allez y écrire le contenu de votre page.
Ouvrez le fichier index.html dans votre bloc note, et copiez le code suivante entre les balises <body></body>.
Rendez-vous dans votre navigateur, et actualisez la page (vous pouvez utilisez le raccourci clavier "touche F5").
Vous devez avoir un bloc gris centré sur la page.
3.2 - Titre de votre page : balise h1
Vous allez maintenant définir le titre de votre page Internet avec l'utilisation de la balise <h1>.
Vous devez copier le code ci-dessous dans les balises <div id="contenu">ici</div>.
3.3 - Titre de votre article : balise h2
Vous allez maintenant définir le titre de votre article avec l'utilisation de la balise <h2>.
Vous devez copier le code ci-dessous en dessous de la balise <h1>.
3.4 - Creation de votre article : balise p
Vous allez maintenant ajouter le texte de votre article en utilisant la balise <p>. Rendez-vous sur un
Lorem Ipsum (générateur de faux texte), et copier autant de paragraphe que vous le souhaitez.
Vous devez ensuite copier le texte après la balise de fermeture </h2>, en l'intégrant dans les balises <p>votre texte ici</p>.
3.5 - Faire un saut de ligne apres vos paragraphes : balise br
Vous allez maintenant apprendre à faire un saut de ligne après vos paragraphes. Pour cela, vous allez utiliser la balise <br />, qui est autofermante.
Elle permet de faire un retour à la ligne. Il faut appliquer deux fois la balise pour effectuer un saut de ligne.
Allez dans votre bloc note, et copiez le code suivant à chaque fin de paragraphe.
Actualisez la page de votre navigateur. Vous devez voir le texte avec des sauts de lignes après chaque paragraphe.