Tag HTML <section>

Le tag HTML <section> a été récemment introduit dans HTML5. Il est utilisé pour regrouper des contenus liés logiquement et créer des sections de page (bloc d'informations, informations de contact, etc.). Le tag <section> est souvent utilisé lors de la création de pages de destination (landing page) pour diviser une page en blocs logiques.

Le tag <section> peut être imbriqué dans le tag <article>, en séparant le contenu en blocs logiques. Dans ce cas, il est nécessaire que les titres <h1>-<h6> soient utilisés dans le tag <article> et le tag <section> intégré. Vous pouvez également utiliser le titre <h2> dans chaque section définie par le tag <section>.

Le tag <article> peut être placé dans le tag <section>, si on souhaite créer des blocs thématiques dans la section. Dans le même temps, les éléments de la règle de placement des en-têtes mentionnés ci-dessus s'appliquent également aux éléments.

Le tag <section> peut également être imbriquée dans une autre tag <section>, mais la hiérarchie des en-têtes ne doit pas être violée.

N’utilisez pas le tag <section> en tant qu’un conteneur universel pour créer les structures des pages, dans ce cas, on utilise le tag <div>.

Syntaxe

Le contenu de l’élément est écrit entre le tag ouvrant (<section>) et le tag fermant (</section>). Le tag fermant est requis.

Exemple

<!DOCTYPE html>
<html>
  <head>
    <title>L'utilisation du tag section</title>
  </head>
  <body>
    <section>
      <h2>Hypertext markup language HTML</h2>
      <p>HTML est le langage de balisage standard pour la création de pages Web et d'applications Web. Les navigateurs reçoivent des documents HTML à partir d'un serveur Web ou d'un stockage local et les convertissent en pages Web multimédias. HTML décrit la structure d'une page Web de manière sémantique et inclut des repères d'origine pour l'apparence du document.</p>
    </section>
    <section>
      <h2>CSS</h2>
      <p>Langage formel, qui est utilisé en tant qu'une zone de description, mise en forme l'apparence d'une page Web, écrit à l'aide de HTML et XHTML, mais il peut être appliqué à n'importe quel document XML, par exemple à SVG ou XUL.</p>
    </section>
  </body>
</html>

Résultat

Attributs

Le tag <section> supporte également les Attributs globaux et les Attributs d'événements.

Comment styler le tag HTML <section> ?

Propriétés communes pour modifier le poids visuel/emphase/taille du texte dans le tag <section>:

Coloration du texte dans le tag HTML <section>:

Styles de mise en page du texte pour la tag HTML <section>:

Autres propriétés utiles pour le tag HTML <section>:




Trouvez-vous cela utile?

Articles Associées