Este artigo fornecerá um conhecimento detalhado e abrangente de tabelas HTML. As várias tags e formatação que podem ser feitas.
Desde o início da tecnologia, uma tabela é uma forma comum de armazenar e visualizar dados. É usado em quase todos os campos para apresentar informações de texto e dados numéricos onde você pode facilmente comparar dois ou mais elementos. Neste artigo, irei discutir Tabelas na seguinte ordem:
Em palavras simples, uma tabela é uma coleção de dados relacionados que consiste em linhas e colunas. Agora, como sabemos, HTML é uma linguagem de marcação padrão para criar páginas da web e exibi-las em um navegador da web. Portanto, criar e trabalhar com tabelas se torna uma sub-habilidade importante para dominar HTML. Neste blog, aprenderemos a trabalhar com tabelas em HTML.
Para definir uma tabela HTML, usamos
tag. Dentro
tag, você primeiro define as linhas da tabela com
tag. Em seguida, você define os cabeçalhos da tabela em
tag. Os dados ou células da tabela são definidos usando
tag.
Tags de tabela HTML
Vejamos primeiro a lista de tags HTML usadas para criar tabelas. Mais tarde, avançando neste blog, aprenderemos como usá-los com a ajuda de exemplos.
: Usado para definir uma mesa
: Usado para definir uma célula de cabeçalho em uma tabela
: Usado para definir uma linha em uma tabela
: Usado para definir uma célula em uma tabela
:Usado para definir a legenda de uma tabela
:Usado para especificar um grupo de uma ou mais colunas em uma tabela para formatação
: Usado para especificar propriedades de coluna para cada coluna dentro de um elemento
:Usado para agrupar o conteúdo do cabeçalho em uma tabela
: Usado para agrupar o conteúdo do corpo em uma tabela
: Usado para agrupar o conteúdo do rodapé em uma tabela
Agora vamos dar uma olhada no código HTML de amostra para criar uma tabela.
Nome
Era
Abhishek
18
Prumo
2,3
Resultado:
Variações da tabela HTML
Atributos de Cellpadding e Cellspacing
Existem dois atributos chamados cellpadding e cellspacing que você pode usar para ajustar o espaço em branco nas células da tabela. O atributo cellspacing define o espaço entre as células da tabela, enquanto o cellpadding representa a distância entre as bordas da célula e o conteúdo dentro de uma célula.
O atributo Colspan é usado para mesclar duas ou mais colunas, enquanto rowspans é usado para mesclar duas ou mais linhas.
Colspan & Rowspan
Lote
Nome
Era
Ciência da Computação
Abhishek
quinze
Prumo
2,3
Pausa
Altura e largura da mesa
O HTML oferece a vantagem de ajustar a altura e largura da mesa. Atributo de largura e altura são usados para definir a largura e altura da tabela, respectivamente. Você pode especificá-lo em termos de porcentagem de área disponível na tela ou em termos de pixels.
Largura e altura da tabela HTML
Abhishek
quinze
Prumo
2,3
Cabeçalho, corpo e rodapé da tabela
Uma tabela pode ser dividida em três seções, ou seja, um cabeçalho, um corpo e um rodapé. Cabeçalho e rodapé são semelhantes ao cabeçalho e rodapé em um documento do Word que permanece comum para todas as páginas, enquanto o corpo contém o conteúdo principal.
tag cria um cabeçalho de tabela separado, enquanto que a tag cria um rodapé de tabela separado. tags contêm o corpo da tabela.
Tabela HTML com cabeçalho, rodapé e corpo
Cabeçalho da Tabela
Rodapé da Tabela
Nome
Era
Marcas
Fundos e legendas da mesa
Você também pode definir um fundo de mesa. Bgcolor atributo define a cor de fundo para toda a tabela, bem como para uma célula, enquanto o atributo background define uma imagem de fundo para toda a tabela e também para apenas uma célula.
A tag de legenda serve como título ou explicação para a tabela que é exibida na parte superior da tabela.
Fundo da tabela HTML
Legenda da Tabela
Coluna 1
Coluna 2
Coluna 3
Linha 1 Célula 1
Linha 1 Célula 2
Linha 1 Célula 3
Linha 2 Célula 2
Linha 2 Célula 3
Linha 3 Célula 1
Com isso, chegamos ao final deste artigo. Agora, depois de executar os trechos acima, você terá entendido como criar tabelas em HTML. Espero que este blog seja informativo e agregue valor para você.
Confira opela Edureka, uma empresa de aprendizagem online confiável com uma rede de mais de 250.000 alunos satisfeitos espalhados por todo o mundo.O Treinamento de Certificação de Desenvolvimento da Web o ajudará a aprender como criar sites impressionantes usando HTML5, CSS3, Twitter Bootstrap 3, jQuery e APIs do Google e implantá-lo no Amazon Simple Storage Service (S3).
Tem alguma questão para nós? Mencione isso na seção de comentários deste artigo e entraremos em contato com você.
