Aula 73 - Atributos de Tabelas

Introdução

Os atributos permitem controlar o comportamento e a apresentação das tabelas HTML.

Embora muitos estilos sejam atualmente aplicados com CSS, é importante conhecer os atributos tradicionalmente utilizados em tabelas.

📌 Os atributos ajudam a definir tamanho, alinhamento e organização das informações exibidas em uma tabela.

O que são Atributos?

Atributos são configurações adicionadas às tags HTML para modificar seu comportamento.

<table border="1">
...
</table>

Nesse exemplo, o atributo border adiciona bordas à tabela.

Atributo Border

Define a espessura da borda da tabela.

<table border="1">

Valor	Resultado
0	Sem borda.
1	Borda simples.
2	Borda mais espessa.

Atributo Width

Define a largura da tabela.

<table width="100%">

Exemplo	Descrição
300	Largura fixa em pixels.
100%	Ocupa toda a largura disponível.

Atributo Align

Era utilizado para alinhar a tabela na página.

<table align="center">

Valor	Posição
left	Esquerda.
center	Centralizado.
right	Direita.

Atributo Cellpadding

Define o espaço interno entre o conteúdo e a borda da célula.

<table cellpadding="10">

Quanto maior o valor, maior será o espaçamento interno.

Atributo Cellspacing

Define o espaço entre as células da tabela.

<table cellspacing="5">

Cria espaçamento visual entre células vizinhas.

Resumo dos Principais Atributos

Atributo	Função
border	Define bordas.
width	Define largura.
align	Alinha a tabela.
cellpadding	Espaço interno.
cellspacing	Espaço entre células.

CSS x Atributos HTML

Atualmente recomenda-se utilizar CSS para controlar a aparência das tabelas.

table {
  width: 100%;
  border-collapse: collapse;
}

💡 CSS oferece mais flexibilidade e melhor manutenção do código.

Aplicações Práticas

Relatórios empresariais.
Painéis administrativos.
Boletins escolares.
Cronogramas.
Listagens de produtos.

Boas Práticas

Priorizar CSS para estilização.
Utilizar tabelas apenas para dados tabulares.
Manter cabeçalhos claros.
Garantir boa legibilidade.
Testar em dispositivos móveis.

Erros Comuns

Erro	Problema
Excesso de atributos HTML	Código desatualizado.
Não usar CSS	Menor flexibilidade.
Tabelas muito largas	Problemas em celulares.

⚠️ Muitos atributos antigos continuam funcionando, mas atualmente o CSS é a solução recomendada.

Resumo Final

Conceito	Descrição
Border	Controla bordas.
Width	Controla largura.
Cellpadding	Espaço interno.
Cellspacing	Espaço externo entre células.

📌 Os atributos de tabela ajudam a compreender a evolução do HTML e a importância do CSS na formatação moderna.

⚙️ Atributos de Tabelas