W3docs

Balise HTML <article>

The <article> tag is used to define logical blocks on a page. W3docs HTML tutorial explains how to use the HTML <article> tag with syntax, examples.

La balise <article> est l'un des éléments HTML5. Elle est utilisée pour définir un contenu indépendant et autonome. Un article doit avoir sa propre signification et être facilement distinguable du reste du contenu de la page web.

L'élément <article> peut inclure :

  • un article de blog
  • un message de forum
  • des actualités
  • un commentaire

Dans le cas où l'élément <article> est imbriqué, l'élément interne représente un article lié à l'élément externe.

Vous pouvez fournir les informations sur l'auteur de l'élément <article> avec l'élément <address>. Cela s'applique à chaque <article> indépendamment, y compris les éléments imbriqués.

Plusieurs balises <article> peuvent être utilisées dans un seul document HTML.

Vous pouvez utiliser des éléments de titre (<h1> à <h6>) à l'intérieur de la balise <article> pour structurer son contenu. Chaque <article> peut commencer par sa propre balise <h1>.

La date et l'heure de publication de la balise <article> peuvent être décrites à l'aide d'un élément <time> avec un attribut datetime.

Syntaxe

La balise <article> s'utilise par paire. Le contenu est écrit entre la balise d'ouverture (<article>) et la balise de fermeture (</article>).

Exemple de la balise HTML <article> :

Exemple de la balise HTML <article>

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
  </head>
  <body>
    <article>
      <h1>Title of the article</h1>
      <p>Text of the article</p>
    </article>
  </body>
</html>

Résultat

article example

Exemple de la balise HTML <article> dans la balise HTML <section> :

Article sur les fleurs avec la balise article|W3Docs

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
  </head>
  <body>
    <section>
      <h1>Articles about flowers</h1>
      <article>
        <h2>Roses</h2>
        <p>Rose – the queen of flowers - is the object of worship and ardent love. Since time immemorial, the rose has been the object of worship and admiration.</p>
      </article>
      <article>
        <h2>Lilies</h2>
        <p> Lily - an amazing beauty flower, one of the most ancient among a variety of bulbous plants. </p>
      </article>
    </section>
  </body>
</html>

Attributs

La balise <article> prend en charge les Attributs globaux et les Attributs d'événement.

Comment styliser une balise HTML <article>

article {
  border: 1px solid #ccc;
  padding: 10px;
  margin-bottom: 10px;
}

Pratique

Pratique

Quelle est la fonctionnalité de la balise HTML <article> ?