Construire un tableau (`<table>`)

Les tableaux HTML servent à afficher des données tabulaires. Ils ne doivent pas servir à faire la mise en page globale d'un site.

Un tableau bien structuré est plus lisible, plus accessible et plus simple à maintenir.

Balises de base

• <table> : tableau
• <tr> : ligne
• <td> : cellule de donnée
• <th> : cellule d'en-tête

<table>
  <tr>
    <th>Prénom</th>
    <th>Âge</th>
  </tr>
  <tr>
    <td>Elon</td>
    <td>53</td>
  </tr>
</table>

Structure recommandée : <thead>, <tbody>, <tfoot>

<table>
  <thead>
    <tr>
      <th>Produit</th>
      <th>Prix</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Banane</td>
      <td>2,50 EUR</td>
    </tr>
  </tbody>
  <tfoot>
    <tr>
      <td>Total</td>
      <td>2,50 EUR</td>
    </tr>
  </tfoot>
</table>

Par défaut, les tableaux n'affichent pas toujours de bordures visibles. On les stylise ensuite en CSS.

Dans les projets pro, on ajoute souvent des en-têtes clairs et un alignement cohérent des colonnes.