Prvek tfoot
Prvek tfoot definuje spodní část tabulky.
Používá se pro seskupení řádků tak,
aby bylo možné okamžitě aplikovat CSS styly
na určitou skupinu. V jedné tabulce
může být pouze jeden prvek tfoot.
Prvek tfoot se často používá společně
s thead
a tbody
pro definování horní části, hlavní části
a spodní části HTML tabulky. Ve výchozím nastavení
prohlížeč umístí obsah tfoot
do spodní části tabulky a thead -
do horní části.
Příklad
Pojďme skupině řádků seskupených prvkem
tfoot nastavit červenou barvu textu
pomocí vlastnosti color:
<table>
<thead>
<tr>
<th>Jméno</th>
<th>Příjmení</th>
<th>Plat</th>
</tr>
</thead>
<tbody>
<tr>
<td>jméno1</td>
<td>příjmení1</td>
<td>200$</td>
</tr>
<tr>
<td>jméno2</td>
<td>příjmení2</td>
<td>1000$</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>počet: 2</td>
<td>-</td>
<td>celkem: 1200$</td>
</tr>
</tfoot>
</table>
tfoot {
color: red;
}
table, td, th {
border: 1px solid black;
}
:
Příklad
A zde se podívejme, thead
není nahoře a tfoot není dole,
přesto je prohlížeč umisťuje na svá
místa:
<table>
<tfoot>
<tr>
<td>počet: 2</td>
<td>-</td>
<td>celkem: 1200$</td>
</tr>
</tfoot>
<tbody>
<tr>
<td>jméno1</td>
<td>příjmení1</td>
<td>200$</td>
</tr>
<tr>
<td>jméno2</td>
<td>příjmení2</td>
<td>1000$</td>
</tr>
</tbody>
<thead>
<tr>
<th>Jméno</th>
<th>Příjmení</th>
<th>Plat</th>
</tr>
</thead>
</table>
tfoot {
color: red;
}
table, td, th {
border: 1px solid black;
}
:
