tabele html: thead vs th

Jeśli chcesz użyć <thead> i <th> nie zapomnij zagnieździć <th> wewnątrz <tr>. W przeciwnym razie kod może nie być ważny.
Przykład:

<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>

th jest bardziej szczegółowe niż to, co może znajdować się wewnątrz thead. Komórka th określa nagłówek odpowiednich komórek td. W rzeczywistości można dodać atrybut headers do komórki td, który wskazuje na id komórki th (dla czytników ekranu). Tak więc {[0] } jest bezpośrednio związane z td S tej kolumny.

Jednakże thead może zawierać dowolne informacje...zwykle tak, Zawiera th komórki, ale może również zawierać wszystko, co możesz uznać za odpowiednie jako informacje na górze tabeli (inne niż podpis, ponieważ ma również swój własny znacznik).

<thead>

Wiersze tabeli mogą być zgrupowane w nagłówku tabeli, stopce tabeli i jednej lub kilku sekcjach ciała tabeli, przy użyciu THEAD, TFOOT i TBODY elementy, odpowiednio. Podział ten umożliwia agentom użytkownika obsługę przewijania korpusów stołu niezależnie od głowicy i stopy stołu. gdy drukowane są długie tabele, informacje o głowicy i stopce tabeli mogą być powtarzane na każdej stronie zawierającej dane tabeli.

Głowica stołu i stopka stołu powinny zawierać informacje o kolumnach tabeli. Treść tabeli powinna zawierać wiersze danych tabeli.

Gdy są obecne, każda THEAD, TFOOT i TBODY zawiera grupę wierszy. Każda grupa wierszy musi zawierać co najmniej jeden wiersz, określony przez element TR.

<th>

Komórki tabeli mogą zawierać dwa rodzaje informacji: informacje nagłówka i dane. Rozróżnienie to umożliwia agentom użytkownika wyraźne renderowanie komórek nagłówka i danych, nawet w przypadku braku arkuszy stylów. Na przykład wizualne agenci użytkownika mogą prezentuj tekst komórki nagłówka pogrubioną czcionką. Syntezatory mowy mogą wyświetlać informacje nagłówka z wyraźną odmianą głosu.

Element TH definiuje komórkę zawierającą informacje nagłówka. Agenci Użytkownika mają dostępne dwie części informacji nagłówka: zawartość elementu TH i wartość atrybutu abbr. Agenci użytkownika muszą renderować zawartość komórki lub wartość atrybutu abbr. W przypadku mediów wizualnych, te ostatnie mogą być odpowiednie, gdy nie ma wystarczających spacja do renderowania pełnej zawartości komórki. W przypadku mediów niewizualnych abbr może być używany jako skrót nagłówków tabel, gdy są one renderowane wraz z zawartością komórek, do których mają zastosowanie.

Źródło: http://www.w3.org/TR/html4/struct/tables.html

<thead> jest wyjątkowy, ponieważ może być używany do powtarzania wiersza nagłówka u góry strony w wersjach drukowanych.

Z tego, co wiem z doświadczenia, nie ma różnicy w renderowaniu, chyba że używasz CSS do określenia różnicy w renderowaniu. A <tr> wewnątrz a <thead> renderuje się tak samo jak <th> wewnątrz a <table> lub a <tbody>.

Nie ma tu twardych zasad. Element <thead> jest kolejnym sposobem grupowania kolumn i wierszy, podobnie jak <tbody> i <tfoot>. Masz więc więcej możliwości tworzenia skryptów i formatowania.