Tabelas

Tabelas são definidas com a tag <table>…</table>. Elas são divididas em linhas, delimitadas pela tag <tr>...</tr>, e colunas, delimitadas pela tag <td>...</td>, nas quais se determina o conteúdo das células. Esse conteúdo pode ser texto, imagens, listas, formulários ou outros elementos.

O elemento table pode conter os atributos:

• border, que indica qual o tipo de borda da tabela (se não for definido, nenhuma borda aparecerá);
• width, que indica a largura da tabela (ele pode ser dado em percentual);
• summary, que fornece uma descrição da tabela, útil em termos de acessibilidade (na Aula 10 você aprenderá sobre acessibilidade).

Veja em detalhes 2 exemplos de tabela na Figura 5.

Além das tags <td>, o elemento <tr> pode conter a tag <th>, que indica um título para a linha/coluna. Esse título aparecerá em negrito e centralizado. No exemplo ilustrado na Figura 5, a segunda tabela possui títulos para as colunas. Dentre os possíveis atributos das tags <tr> e <td> existem os atributos colspan e rowspan, que servem para indicar a quantidade de células (linha ou coluna) que serão ocupadas por um certo conteúdo. Por exemplo, a Figura 6 ilustra uma tabela com um título para as duas colunas.