📊 Tabelas (dados tabulares)

Tabelas são usadas para exibir dados em formato de linhas e colunas.

Estrutura Básica

Uma tabela é criada com a tag <table>. Dentro dela, <tr> cria uma linha, <th> cria uma célula de cabeçalho e <td> cria uma célula de dados.

<table>
  <tr>
    <th>Nome</th>
    <th>Idade</th>
  </tr>
  <tr>
    <td>Ana</td>
    <td>25</td>
  </tr>
</table>
Nome Idade
Ana 25

Estrutura Semântica

Para tabelas mais complexas, é uma boa prática usar <thead> para o cabeçalho, <tbody> para o corpo e <tfoot> para o rodapé.

<table>
  <thead>...</thead>
  <tbody>...</tbody>
  <tfoot>...</tfoot>
</table>

Mesclando Células (colspan e rowspan)

colspan mescla colunas, enquanto rowspan mescla linhas.

<table>
  <tr>
    <th>Nome</th>
    <th colspan="2">Telefones</th>
  </tr>
  <tr>
    <td>João</td>
    <td>1111-1111</td>
    <td>2222-2222</td>
  </tr>
</table>
Nome Telefones
João 1111-1111 2222-2222