As tabelas HTML são utilizadas apenas para apresentar dados
tabulares, ou seja, que necessitam serem apresentado em uma ordem lógica com
linhas e colunas.
A criação de tabelas não é tão complicada, explicandos as
três tags básicas para a criação de tabelas, torna tudo mais fácil.
As três principais tags necessárias são <tabel>,
<tr> e <td>. Mas temos outras que são utilizadas para ter uma
melhoria na semântica do código, que são <th>, <caption>, <thead>,
<tbody> e <tfoot>.
<table> : necessário no início e no fim da tabela,
indica a criação da tabela e o fim da criação.
<tr> = table row: é para a inserção de uma linha na
tabela, inicia e termina a linha na horizontal.
<td> = table data: é para a inserção de uma célula
dentro da linha.
<th> : para criação de um título dentro da tabela,
melhor semântica.
<caption>: para a legenda da tabela.
<thead>: por boas maneiras, na linha de cabeçalho da
tabela.
<tbody>: por boas maneiras, para o corpo da tabela.
<tfoot>: por boas maneiras, para a linha do rodapé da
tabela.
Obs: todas as linhas <tr> tem que ter o mesmo número
de colunas <td>, caso haja necessidade de mesclar as linhas ou as colunas
utiliza se <colspan> e <rowspan>.
<colspan>: para mesclar em colunas.
<rowspan>: para mesclar em linhas.
Como descrito anteriormente as tabelas são ultilizadas
apenas para apresentar dados tabulados. Antes os layout’s das páginas eram criados por meio
de tabelas, mas após as novas indicações
da WC3 os layout’s são criados de outras formas, que contem melhor semântica no
código HTML.
Para se ter uma tabela de fácil entendimento, é necessário
informar ao usuário dados que possibilitem o entendimento, como, nome,
descrição, cabeçalhos entre outros.
A seguir teremos o exemplo do código em HTML, para
entendermos tudo o que foi citado acima.
 |
| Codificação da Tabelas |
 |
| Resultado da Codificação |
