Tabelas existem no HTML para organizar dados tabulares. Elas não servem para montar layout de página — e entender isso muda tudo.
Nesta aula, vamos aprender a usar tabelas corretamente e evitar um dos maiores erros do passado da web.
O que é uma tabela no HTML?
Uma tabela é uma estrutura formada por linhas e colunas, usada para representar dados relacionados.
Exemplos de uso correto:
- Resultados de vendas
- Horários
- Relatórios
- Comparações de dados
Estrutura básica de uma tabela
A estrutura mínima de uma tabela envolve estas tags:
<table>— tabela<tr>— linha da tabela<td>— célula de dados
<table>
<tr>
<td>Produto</td>
<td>Preço</td>
</tr>
<tr>
<td>Teclado</td>
<td>R$ 120</td>
</tr>
</table> O código acima resultará na seguinte página sendo criada:
Cabeçalhos de tabela com <th>
Para indicar títulos de colunas ou linhas, usamos a tag
<th>.
<table>
<tr>
<th>Produto</th>
<th>Preço</th>
</tr>
<tr>
<td>Mouse</td>
<td>R$ 80</td>
</tr>
</table> O código acima resultará na seguinte página sendo criada:
<th> melhora a acessibilidade e a leitura dos dados. Tabelas são para dados, não para layout
Nunca use tabelas para:
- Organizar colunas de layout
- Alinhar textos visualmente
- Montar estrutura de página
Para layout, usamos CSS. Para dados, usamos tabelas.
Exemplo de uso correto
<table>
<tr>
<th>Aluno</th>
<th>Nota</th>
</tr>
<tr>
<td>Ana</td>
<td>9.5</td>
</tr>
<tr>
<td>João</td>
<td>8.0</td>
</tr>
</table> O código acima resultará na seguinte página sendo criada:
Resumo visual
💾🧠 Resumo da aula para nunca mais esquecer
- Tabelas servem para organizar dados
<table>cria a tabela<tr>cria linhas<td>cria células<th>cria cabeçalhos- Nunca use tabelas para layout
Na próxima aula, vamos aprender sobre HTML semântico (HTML5) e entender por que ele é tão importante hoje.
HARDWARE
Entendendo o seu computador
O que há dentro do meu computador?
Existem alguns componentes fundamentais presentes dentro do seu computador e é muito importante que você conheça um pouco sobre eles, seja para argumentar com algum vendedor durante a compra de um novo PC ou para identificar alguma atitude desleal de algum técnico que esteja te passando um orçamento para reparo. Na seção Raio-X aqui do Contém Bits você pode conhecer e entender mais detalhadamente sobre cada componente, ou também pode clicar abaixo no componente que deseja, para conhecê-lo melhor.
-
Gabinetes
-
Placas-Mãe
-
Processadores
-
Memória
-
Fontes
-
Drives Ópticos
-
Discos Rígidos
-
SSD
-
Placas de Som
-
Placas de Vídeo
Você Sabia?
Mortal Kombat - O Filme
O filme Mortal Kombat, inspirado no jogo de mesmo nome, faturou 23 milhões de dólares apenas no fim de semana de estreia nos EUA. Ainda sobre este título de sucesso, outra cifra que impressiona é o faturamento ao longo do primeiro ano: 1 bilhão de dólares no mundo todo.
Nintendo Entertainment System
O console Nintendo Entertainment System (NES), da Nintendo, detém o recorde de videogame mais clonado em todo o mundo. Já foram catalogados mais de 300 aparelhos diferentes capazes de reproduzir seus jogos! Saiba mais sobre ele aqui.
Mario em Donkey Kong
O personagem Mario surgiu pela primeira vez no mundo dos games em um jogo chamado Donkey Kong, lançado em 1981. Mario, que naquela época se chamava Jumpman, não era o personagem principal do jogo, mas ele se tornaria um dos mais famosos personagens do mundo dos games. Saiba mais.
Civilization
A empresa Take-Two pagou à Infogrames mais de 22 milhões de dólares pelos direitos de Civilization, em novembro de 1994. Ainda sobre este título, Sid Meier, um dos seus fundadores, é o profissional da área dos games mais premiado em todo o mundo.
Duck Hunt
Ao completar o nível 99 do jogo Duck Hunt, para Nintendo, o jogo retorna ao primeiro nível, mas um bug impede que se acerte os patos neste recomeço. Este é um exemplo do que é chamado no mundo dos games de "Kill Screen".