Das thead-Tag
Das Tag thead definiert den Kopfbereich einer Tabelle.
Es wird verwendet, um Zeilen so zu gruppieren,
dass CSS-Stile sofort auf eine bestimmte Gruppe angewendet werden
können. Eine Tabelle kann nur ein thead-Tag enthalten.
Das thead-Tag wird oft zusammen mit
tbody
und tfoot
verwendet, um den Kopf, den Hauptteil
und den Fuß einer HTML-Tabelle zu definieren.
Beispiel
Lassen Sie uns der Zeilengruppe, die durch das
thead-Tag zusammengefasst ist, eine rote Textfarbe
mit der Eigenschaft color hinzufügen:
<table>
<thead>
<tr>
<th>Name</th>
<th>Surn</th>
<th>Salary</th>
</tr>
</thead>
<tbody>
<tr>
<td>name1</td>
<td>surn1</td>
<td>200$</td>
</tr>
<tr>
<td>name2</td>
<td>surn2</td>
<td>1000$</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>count: 2</td>
<td>-</td>
<td>total: 1200$</td>
</tr>
</tfoot>
</table>
thead {
color: red;
}
table, td, th {
border: 1px solid black;
}
:
Beispiel
Hier steht thead nicht oben und tfoot
nicht unten, dennoch wird der Browser sie
an den richtigen Platz setzen:
<table>
<tfoot>
<tr>
<td>count: 2</td>
<td>-</td>
<td>total: 1200$</td>
</tr>
</tfoot>
<tbody>
<tr>
<td>name1</td>
<td>surn1</td>
<td>200$</td>
</tr>
<tr>
<td>name2</td>
<td>surn2</td>
<td>1000$</td>
</tr>
</tbody>
<thead>
<tr>
<th>Name</th>
<th>Surn</th>
<th>Salary</th>
</tr>
</thead>
</table>
table, td, th {
border: 1px solid black;
}
: