é um elemento HTML que exibe dados em tabular formatar. As tabelas HTML usam linhas e colunas para facilitar a interpretação de dados e relacionamentos.
Você pode usar um
elemento para exibir um cronograma ou a estrutura de preços de um produto. As tabelas exibem o conteúdo relacionado de maneira acessível e fácil de entender rapidamente.
Exemplo
O HTML
O elemento funciona com alguns elementos aninhados obrigatórios e alguns opcionais.
Sintaxe
1
2
3
First name
4
Last name
5
Occupation
6
7
8
9
John
10
Doe
11
Scientist
12
13
14
Jane
15
Doe
16
Web Developer
17
18
19
Resultado
Suporte ao navegador
O
tag é suportada em todos os navegadores modernos, bem como em muitos clientes de e-mail. Leia mais em caniuse.com.
Atributos
O
tag suporta Atributos Globais em HTML. Os Atributos Globais são comuns a todos os elementos HTML e podem ser usados em todos eles (embora possam não ter muito efeito em alguns deles).
Contente
Nas tabelas, você pode usar uma variedade de elementos HTML adicionais.
- Legendas da tabela:
- Grupos de linhas:
,
e
- Grupos de colunas:
- Linhas da tabela:
- Células da tabela:
e
Adicionar
para Melhor Acessibilidade
Para aumentar a acessibilidade, tente adicionar um
elemento imediatamente após a abertura
tag, dando uma descrição clara da finalidade da tabela.
O exemplo acima usa o CSS caption-side para posicionar a legenda. Isso pode ser top ou bottom.
O
ajudará alguém a entender qual conteúdo está sendo apresentado e se deve gastar tempo digerindo-o. Além disso, o
O elemento fornece dicas para tecnologias assistivas, como leitores de tela.
Estilizando Tabelas HTML
As mesas são rígidas, mas podem ser estilizadas para atender à maioria das necessidades. Propriedades CSS que podem ser úteis para estilizar um
elemento inclui width, border, border-style, border-color, border-width, border-collapse, border-spacing, margin, padding, text-aligne vertical-align.
Considerações sobre dispositivos móveis
- Não use tabelas, a menos que o dispositivo ou dispositivos sejam compatíveis com elas (1)
- Não use tabelas aninhadas (2)
- Não use tabelas para layout (3)
- Use alternativas para apresentação tabular (4)
Saber mais
Você sabia?
foi relativamente atrasado para HTML, sendo introduzido apenas na especificação em janeiro de 1997.
Após sua introdução à especificação HTML, as tabelas logo foram usadas para criar layouts para páginas da web. Este foi um desenvolvimento lógico, pois eles permitem colunas e conteúdo aninhado.
Pacotes gráficos como o Adobe Photoshop embarcaram, desenvolvendo a ferramenta Slice, que permitia que os designs fossem “fatiados” e exportados em pedaços, prontos para serem remontados nas células da tabela.
Embora tudo isso tenha sido um uso incorreto do
elemento, não havia alternativas de layout na época. Hoje em dia, os layouts baseados em tabelas na web não são necessários, pois o CSS fornece melhores soluções.
Newer PostElemento HTML: tr
Deixe uma resposta
Scroll