article html
L’élément d’article est l’occasion idéale pour le développeur d’inclure un élément de contenu qui sera séparé du reste du contenu.
Définition et utilisation
La <article>
balise spécifie un contenu indépendant et autonome. Il peut s’agir d’un message sur les réseaux sociaux, d’un commentaire d’utilisateur, d’un article de presse ou même d’un article de blog.
Trois articles avec un contenu indépendant et autonome.
<article> <a href="/html-section-tag"> <h2>HTML <section> Tag</h2> <div> <time> 13 mai 2022</time> <div>HTML</div> </div> </a> </article> <article> <a href="/html-lang"> <h2>HTML lang Attribute</h2> <div> <time> 12 mai 2022</time> <div>HTML</div> </div> </a> </article> <article> <a href="/html-audio-tag"> <h2>HTML Audio Tag</h2> <div> <time> 11 mai 2022</time> <div>HTML</div> </div> </a> </article>
html article
Remarque :
<article>
l’élément ne s’affiche pas comme quelque chose de spécial dans un navigateur.
Il est important de savoir que si nous avons un article avec un contenu long, nous pouvons utiliser des sections à l’intérieur de l’élément d’article pour casser logiquement le contenu.
<!--article démarrer--> <article> <h1>Salut tout le monde</h1> <section> <h2>Bonjour de California</h2> <p> Lorem ipsum dolor sit amet consectetur adipisicing elit. Adipisci, iste? </p> </section> <section> <h2>Bonjour de London</h2> <p> Lorem ipsum dolor sit amet consectetur adipisicing elit. Adipisci, iste? </p> </section> <section> <h2>Bonjour de Austria</h2> <p> Lorem ipsum dolor sit amet consectetur adipisicing elit. Adipisci, iste? </p> </section> </article> <!--article fin-->
balise article
Comme vous pouvez le voir dans l’exemple ci-dessus, l’élément article peut avoir de nombreux éléments de section.
Prise en charge du navigateur
Les chiffres du tableau spécifient la première version du navigateur qui prend entièrement en charge l’élément.
Élément | Chrome | Edge | Mozilla | Safari | Opera |
---|---|---|---|---|---|
<article> | 6.0 | 9.0 | 4.0 | 5.0 | 11.1 |
Notez à l’esprit que si le contenu est autonome, préférez utiliser la
<article>
balise ”. Vous pouvez utiliser CSS pour styliser<article>
l’élément.
Paramètres CSS par défaut
La plupart des navigateurs affichent <article>
l’élément ” avec les valeurs par défaut suivantes.
article { display: block; }