De tfoot-tag
De tag tfoot definieert het onderste deel van een tabel.
Wordt gebruikt om rijen te groeperen op zo'n
manier dat CSS-stijlen direct op een bepaalde groep kunnen
worden toegepast. Een tabel kan
slechts één tfoot-tag bevatten.
De tag tfoot wordt vaak samen gebruikt
met thead
en tbody
om het bovenste deel, het hoofdgedeelte
en het onderste deel van een HTML-tabel te definiëren. Standaard
plaatst de browser de inhoud van tfoot
onderaan de tabel, en thead -
bovenaan.
Voorbeeld
Laten we de groep rijen, gegroepeerd door de tag
tfoot, een rode tekstkleur geven
met behulp van de eigenschap color:
<table>
<thead>
<tr>
<th>Naam</th>
<th>Achternaam</th>
<th>Salaris</th>
</tr>
</thead>
<tbody>
<tr>
<td>naam1</td>
<td>achternaam1</td>
<td>200$</td>
</tr>
<tr>
<td>naam2</td>
<td>achternaam2</td>
<td>1000$</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>aantal: 2</td>
<td>-</td>
<td>totaal: 1200$</td>
</tr>
</tfoot>
</table>
tfoot {
color: red;
}
table, td, th {
border: 1px solid black;
}
:
Voorbeeld
En hier, laten we kijken, thead
staat niet bovenaan, en tfoot staat niet onderaan,
toch plaatst de browser ze op hun
eigen plaatsen:
<table>
<tfoot>
<tr>
<td>aantal: 2</td>
<td>-</td>
<td>totaal: 1200$</td>
</tr>
</tfoot>
<tbody>
<tr>
<td>naam1</td>
<td>achternaam1</td>
<td>200$</td>
</tr>
<tr>
<td>naam2</td>
<td>achternaam2</td>
<td>1000$</td>
</tr>
</tbody>
<thead>
<tr>
<th>Naam</th>
<th>Achternaam</th>
<th>Salaris</th>
</tr>
</thead>
</table>
tfoot {
color: red;
}
table, td, th {
border: 1px solid black;
}
:
