Documentos Técnicos

A tabela

table

A tag <table>, associada às tags <tr> e <td>, marcam uma tabela formada por linhas e colunas. A tabela tem como objetivo apresentar dados organizados, cada tipo de informação ocupando uma coluna diferente.

Quando a tag <table> foi criada, numa época em que CSS ainda não existia e os elementos da HTML 1 não permitiam controlar bem o posicionamento dos elementos de uma página, logo foi percebido que a tabela poderia ser utilizada como forma de colocar elementos posicionados lado a lado, criando colunas de texto, ao estilo de jornais e revistas. Isso transformou a maneira de criar as páginas Internet que, a partir de 1997 (HTML 3.2), puderam exibir mais que uma sequência de parágrafos de texto, um abaixo de outro. Fazer layout com tabelas se tornou comum. Hoje esta prática é desaconselhada, apesar de ainda encontramos alguns sites que mantém esta estrutura.

Exemplo de uso:

O código abaixo exibe uma tabela:

<table>
<tr>
<td>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</td>
<td>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</td>
<td>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.</td>
</tr>
</table>

O resultado do código HTML acima é este:

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.


Conheça também as outras tags usadas para criar a tabela: caption, thead, tbody e tfoot, th, tr e td.