Wat is de structuur van een tabel in HTML?

De HTML-tabelstructuur wordt gedefinieerd door verschillende elementen:

• <table>: Omhulling van de tabel.
• <caption>: Optionele titel van de tabel.
• <colgroup> en <col>: Optionele elementen voor het groeperen van kolommen en het toepassen van stijlen.
• <thead>: Sectie van kolomtitels.
• <tbody>: Sectie van de hoofdinhoud van de tabel.
• <tfoot>: Sectie van de voettekst van de tabel.
• <tr>: Tabelrij.
• <th>: Kopcel in een rij.
• <td>: Gegevenscel in een rij.

De elementen <thead>, <tbody> en <tfoot> helpen bij het groeperen van rijen op basis van betekenis en kunnen door browsers worden gebruikt om de weergave van grote tabellen te optimaliseren. Binnen deze secties bevinden zich <tr>-elementen. Binnen <tr> bevinden zich <th> (in <thead>, soms in <tbody> of <tfoot>) of <td> (in <tbody> en <tfoot>, soms in <thead>).

Voorbeeld van een basisstructuur:

<table>
  <caption>
    Productlijst
  </caption>
  <thead>
    <tr>
      <th>Naam</th>
      <th>Prijs</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Product 1</td>
      <td>100</td>
    </tr>
    <tr>
      <td>Product 2</td>
      <td>150</td>
    </tr>
  </tbody>
  <tfoot>
    <tr>
      <td colspan="2">Totaal: 250</td>
    </tr>
  </tfoot>
</table>