Definição e uso de: <TFOOT></TFOOT>HTML com Estilo

O marcador <TFOOT></TFOOT> "Table Foot Element" ou linha de resumo, somatórias de colunas, etc., de uma tabela HTML, é indicação para o navegador que essa linha é a última de uma tabela.

O código fonte <TFOOT></TFOOT> deverá vir sempre depois da tag <THEAD></THEAD> e nunca depois da tag <TBODY></TBODY>.

<table cellspacing="1" cellpadding="2" align="center" style="background: #000000; border: 1px solid #333333; font-family: Arial, Verdana, Geneva, Helvetica, sans-serif; font-size: 11px;">
<caption style="color:#000;">Produtos Recebidos</caption>
<thead>
<tr style="background: #FFCC00;">
<th>Data</th>
<th>Prod A<br />Quantidade</th>
<th>Nível de<br />Qualidade</th>
<th>Prod B<br />Quantidade</th>
<th>Nível de<br />Qualidade</th>
<th>Prod C<br />Quantidade</th>
<th>Nível de<br />Qualidade</th>
<th>Prod D<br />Quantidade</th>
<th>Nível de<br />Qualidade</th></tr></thead>
<tfoot>
<tr style="background: Olive">
<td>Média</td>
<td align="right">105</td>
<td>Bom</td>
<td align="right">115</td>
<td>Bom</td>
<td align="right">67</td>
<td>Ótimo</td>
<td align="right">85</td>
<td>Bom</td></tr></tfoot>

<tr style="background: #FFFF99;">
<td align="center">30/05/11</td>
<td align="right">100</td>
<td>Bom</td>
<td align="right">125</td>
<td>Ótimo</td>
<td align="right">55</td>
<td>Bom</td>
<td align="right">75</td>
<td>Bom</td></tr>
<tr style="background: #FFFF99;">
<td>31/05/11</td>
<td align="right">110</td>
<td>Bom</td>
<td align="right">105</td>
<td>Bom</td>
<td align="right">80</td>
<td>Ótimo</td>
<td align="right">95</td>
<td>Bom</td></tr></table>
O código fonte acima será visualizado assim no navegador:
Produtos Recebidos
Data Prod A
Quantidade
Nível de
Qualidade
Prod B
Quantidade
Nível de
Qualidade
Prod C
Quantidade
Nível de
Qualidade
Prod D
Quantidade
Nível de
Qualidade
Média 105 Bom 115 Bom 67 Ótimo 85 Bom
30/05/11 100 Bom 125 Ótimo 55 Bom 75 Bom
31/05/11 110 Bom 105 Bom 80 Ótimo 95 Bom