tableaux html: thead vs th

Il semble (d'après les exemples sur cette page , de toute façon) que si vous utilisez THEAD, vous n'avez pas besoin d'utiliser TH.

Est-ce vrai? Si oui, quels sont les avantages / inconvénients de THEAD par rapport à TH?

La <thead>balise est utilisée pour regrouper le contenu de l'en-tête dans un tableau HTML. L' theadélément doit être utilisé en conjonction avec les éléments tbodyet tfoot.

Plus: thead

Vous utilisez <thead>pour encapsuler une ligne entière (ou des lignes) pour les désigner comme en-tête de tableau. Selon les spécifications,

«Cette division permet aux agents utilisateurs de prendre en charge le défilement des corps de tableau indépendamment de la tête et du pied du tableau. Lorsque de longs tableaux sont imprimés, les informations d'en-tête et de pied de tableau peuvent être répétées sur chaque page contenant des données de tableau.

<th>, d'autre part, est utilisé pour styliser une cellule spécifique comme une cellule d'en-tête plutôt que comme une cellule de données ordinaire.

<th>est en fait un remplacement <td>lorsque vous souhaitez marquer une cellule comme cellule d'en-tête.

Si vous voulez utiliser <thead>et <th>n'oubliez pas de nicher à l' <th>intérieur <tr>. Sinon, le code peut ne pas être valide.
Exemple:

<table>
  <thead>
    <tr>
      <th>Season</th>
      <th>Goals</th>
      <th>Assists</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <th>2009-2010</th>
      <td>25</td>
      <td>43</td>
    </tr>
    <tr>
      <th>2011-2012</th>
      <td>40</td>
      <td>20</td>
    </tr>
  </tbody>
</table>

thest plus spécifique que ce qui peut résider à l'intérieur de thead. Une thcellule consiste à spécifier l'en-tête des tdcellules correspondantes . En fait, vous pouvez ajouter un headersattribut à une tdcellule qui pointe vers l'id d'une thcellule (pour les lecteurs d'écran). Donc, thest directement lié aux tds de cette colonne.

Cependant, theadpeut inclure n'importe quelle information ... généralement oui, cela inclut les thcellules, mais il peut également inclure tout ce que vous pourriez juger approprié en tant qu'information en haut du tableau (autre qu'une légende, car il a sa propre balise comme bien).

<thead> est spécial en ce qu'il peut être utilisé pour répéter la ligne d'en-tête en haut de la page dans les versions imprimées.

<thead>

Les lignes de tableau peuvent être regroupés dans une tête de table, les pieds de table, et une ou plusieurs sections de corps de table, en utilisant les THEAD, TFOOTet les TBODYéléments, respectivement. Cette division permet aux agents utilisateurs de prendre en charge le défilement des corps de table indépendamment de la tête et du pied de table. Lorsque de longs tableaux sont imprimés, les informations d'en-tête et de pied de tableau peuvent être répétées sur chaque page contenant des données de tableau.

L'en-tête et le pied de table doivent contenir des informations sur les colonnes de la table. Le corps de la table doit contenir des lignes de données de table.

Lorsqu'ils sont présents, chaque THEAD, TFOOT et TBODY contient un groupe de lignes. Chaque groupe de lignes doit contenir au moins une ligne, définie par l'élément TR.

<th>

Les cellules de tableau peuvent contenir deux types d'informations: les informations d'en-tête et les données. Cette distinction permet aux agents utilisateurs de rendre distinctement les en-têtes et les cellules de données, même en l'absence de feuilles de style. Par exemple, les agents utilisateurs visuels peuvent présenter un texte de cellule d'en-tête avec une police en gras. Les synthétiseurs vocaux peuvent rendre les informations d'en-tête avec une inflexion vocale distincte.

L'élément TH définit une cellule qui contient des informations d'en-tête. Les agents utilisateurs ont deux informations d'en-tête disponibles: le contenu de l'élément TH et la valeur de l'attribut abbr. Les agents utilisateurs doivent rendre le contenu de la cellule ou la valeur de l'attribut abbr. Pour les médias visuels, ce dernier peut être approprié lorsque l'espace est insuffisant pour rendre le contenu complet de la cellule. Pour les médias non visuels, l'abbr peut être utilisé comme abréviation pour les en-têtes de tableau lorsqu'ils sont rendus avec le contenu des cellules auxquelles ils s'appliquent.

Source: http://www.w3.org/TR/html4/struct/tables.html

D'après mon expérience, il n'y a aucune différence de rendu à moins que vous n'utilisiez CSS pour spécifier une différence de rendu. Un <td>intérieur de a <thead>rendra la même chose qu'un <th>intérieur de a <table>ou a <tbody>.

Il n'y a pas de règles strictes ici. L' <thead>élément est juste une autre façon de regrouper vos colonnes et vos lignes, tout comme <tbody>et <tfoot>est. Vous avez donc plus de possibilités de script et de formatage.