Au début du cours, nous avons étudié la syntaxe d’une balise html et introduit quelques balises principalement de type inline, et liées aux textes. <a> <strong> <em> <span> et la seule de type block pour l’instant <p>

La différence entre inline et block est la suivante :

Les balises inline sont affichées sur la même ligne, les unes à côté des autres. Elles ne prennent pas toute la largeur de la page, mais seulement la place dont elles ont besoin. Par exemple, les balises <a> <strong> <em> <span> <img> sont des balises inline.

Les balises block sont affichées sur une nouvelle ligne, les unes en dessous des autres. Elles prennent toute la largeur de la page, sauf si elles sont contenues dans un autre élément block. Par exemple, les balises <p> <h1> <h2> <div> <header> <footer> , sont des balises block.

Nouvelles balises à retenir

<br>

La balise <br> est une balise autofermante qui crée un saut de ligne dans le texte. (elle est considérée comme inline)

<p>Ceci est un paragraphe.<br>
Ceci est un autre paragraphe.</p>

<div>

La balise <div> block est une balise de bloc qui permet de regrouper du contenu. Elle n’a pas de signification sémantique particulière, mais elle peut être utilisée pour créer des sections de contenu ou pour appliquer des styles CSS spécifiques à un groupe de contenu.

<div>
  <h1>Mon premier site web</h1>
  <p>Bienvenue sur mon site web !</p>
</div>

<h1> à <h6>

Les balises <h1> à <h6> block sont des balises de titre qui indiquent l’importance du texte qu’elles encadrent. <h1> est le titre le plus important, suivi de <h2>, <h3>, etc.

<h1>Mon premier site web</h1>
<h2>Introduction</h2>
<h3>À propos de moi</h3>
<h4>Mes compétences</h4>
<h5>Mes projets</h6>

<header>, <nav>, <main>, <section>, <footer> block

Ces balises sont utilisées pour structurer le contenu d’une page web.

• <header> contient les éléments d’en-tête de la page, tels que le titre, la navigation, etc.
• <nav> contient les liens du menu du site. Est généralement contenu dans le <header> mais peu aussi être ailleurs
• <main> contient le contenu principal de la page.
• <section> permet de regrouper du contenu thématique.
• <footer> contient les éléments de pied de page de la page, tels que les mentions légales, etc.

En résumé, ces balises sont utilisées pour structurer le contenu de votre page web et pour lui donner un sens sémantique.