Tag thead
Il tag thead definisce la parte superiore di una tabella.
Viene utilizzato per raggruppare le righe in modo
da poter applicare immediatamente stili CSS a un determinato
gruppo. In una tabella può esserci solo un tag thead.
Il tag thead viene spesso utilizzato insieme
a tbody
e tfoot
per definire la parte superiore, la parte principale
e la parte inferiore di una tabella HTML.
Esempio
Aggiungiamo il colore rosso al testo al gruppo di righe
raggruppate dal tag thead, utilizzando la proprietà
color:
<table>
<thead>
<tr>
<th>Nome</th>
<th>Cognome</th>
<th>Stipendio</th>
</tr>
</thead>
<tbody>
<tr>
<td>nome1</td>
<td>cognome1</td>
<td>200$</td>
</tr>
<tr>
<td>nome2</td>
<td>cognome2</td>
<td>1000$</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>conteggio: 2</td>
<td>-</td>
<td>totale: 1200$</td>
</tr>
</tfoot>
</table>
thead {
color: red;
}
table, td, th {
border: 1px solid black;
}
:
Esempio
Qui thead non è in alto, e tfoot
non è in basso, tuttavia il browser li posizionerà
nei loro posti corretti:
<table>
<tfoot>
<tr>
<td>conteggio: 2</td>
<td>-</td>
<td>totale: 1200$</td>
</tr>
</tfoot>
<tbody>
<tr>
<td>nome1</td>
<td>cognome1</td>
<td>200$</td>
</tr>
<tr>
<td>nome2</td>
<td>cognome2</td>
<td>1000$</td>
</tr>
</tbody>
<thead>
<tr>
<th>Nome</th>
<th>Cognome</th>
<th>Stipendio</th>
</tr>
</thead>
</table>
table, td, th {
border: 1px solid black;
}
:
