Olá, Jacqueline, tudo bem? =)
Vamos lá... =)
Como você mesma já mencionou, todas essas três tags são utilizadas em tabelas - <table>
.
Então a estrutura final de uma tabela completa é mais ou menos assim:
<table>
<thead>
<tr>
<th>Título da primeira coluna</th>
<th>Título da segunda coluna</th>
</tr>
</thead>
<tbody>
<tr>
<td>Conteúdo da primeira coluna</td>
<td>Conteúdo da segunda coluna</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>Rodapé da primeira coluna</td>
<td>Rodapé da segunda coluna</td>
</tr>
</tfoot>
</table>
Repare que já tentei deixar o conteúdo mais ou menos auto-explicativo...
As três tags que você mencionou são utilizadas para dividir o conteúdo da tabela em três: cabeçalho (<thead>
), corpo (<tbody>
) e o rodapé (<tfoot>
).
Mas repare que ainda tive que colocar uma <tr>
em cada um deles, pois elas são meramente simbólicas, enquanto que a <tr>
representa uma linha dessa tabela.
Não sei se você chegou a ver a tag <th>
, também, que coloquei... Você poderia usar o <td>
ao invés dela, que também funcionaria, mas como geralmente usamos o título de cada coluna centralizado e até mesmo em negrito, podemos usar essa tag que fará isso para nós. =)
Além disso, não importa a ordem em que colocamos <thead>
, <tbody>
e <tfoot>
dentro da <table>
, pois o browser sempre renderizará nessa ordem - cabeçalho, corpo e, depois, rodapé.
Espero ter ajudado, mas qualquer dúvida não deixe de abrir uma nova thread aqui no fórum para podermos ajudá-la! =)
Abraço e bons estudos,
Fábio