- Página Inicial
- Códigos HTML Prontos
- Tabelas no Html
- Voltar
Tabelas no Html – Conheça cada tag da <table> HTML

Como colocar tabelas no HTML
A tag utilizada para criar uma tabela HTML é a tag <table>, posteriormente fechada com </table>. Dentro dela, incluímos todos os elementos que compõem nossa tabela, ou seja, as células da tabela. Assim sendo, os elementos de uma tabela consistem em outras tags que poderão ser utilizadas.
Uma tabela no HTML é formada por três tags básicas que são: <table>, <tr> e <td>
Tag <table> significa “tabela” indica onde começa e termina uma tabela;
Tag <tr> significa “table row” linha de tabela e indica onde começa e termina e uma linha horizontal da tabela;
Tag <td> significa “table data” dados da tabela e indica onde começa e termina cada célula contida nas linhas da tabela.
A tag <table> define uma tabela HTML.
Uma tabela HTML consiste em um <table>
elemento e um ou mais elementos <tr> , <th> e <td> .
O elemento <tr> define uma linha da tabela, o elemento <th> define um cabeçalho da tabela e o elemento <td> define uma célula da tabela.
Uma tabela HTML também pode incluir elementos <caption> , <colgroup> , <thead> , <tfoot> e <tbody> .
Veja o Exemplo na Prática.
<table> <caption>Front-End</caption> <tr> <th>Html</th> <th>Css</th> <th>jQuery</th> </tr> <tr> <td>Table</td> <td>Responsivo</td> <td>FadeIn</td> </tr> <tr> <td>Article</td> <td>Hoverlay</td> <td>FadeOut</td> </tr> <tr> <td>Form</td> <td>Loading</td> <td>Toggle </td> </tr> </table>
No exemplo acima começamos uma tabela com a tag <table> e em seguida utilizamos a tag <tr> indicando o início de uma linha;
Dentro dessa primeira linha da tabela inserimos cinco células colunas que são representados pelo conjunto de tags <td> e </td>, que são responsáveis por exibir o conteúdo de cada célula no navegador.
A primeira linha termina com a tag </tr> e uma nova linha começa imediatamente com a tag <tr>, seguindo a mesma estrutura da linha anterior e, ao final dela, temos a tag <table> indicando o fim da tabela.
Definição de cada tag de Tabela no Html!
<table> – Define uma tabela
<th> – Define um cabeçalho de tabela
<tr> – Define uma linha de tabela
<td> – Define uma célula de tabela
<caption> – Define um título de tabela
<colgroup> – Define um grupo de colunas de tabela
<col> – Define um cabeçalho de tabela
<tbody> – Define o corpo de uma tabela
<tfoot> – Defines o rodapé (footer) de uma tabela
As tabelas são úteis para várias tarefas, como apresentar informações de texto e dados numéricos. Ele pode ser usado para comparar dois ou mais itens no layout de formulário tabular. As tabelas são usadas para criar bancos de dados.
Veja o exemplo no código Html
<table> <tr> <th>Front-end</th> <th>Back-end</th> <th>Sites</th> </tr> <tr> <td>Html</td> <td>PHP</td> <td>Onepage</td> </tr> <tr> <td>Css</td> <td>MySql</td> <td>Templates</td> </tr> <tr> <td>jQuery</td> <td>Banco de Dados</td> <td>Sites Responsivos</td> </tr> </table>
Neste artigo abordamos sobre a tag Html table.
Tabela no Html
Veja Outros Artigos Relacionados a Tabelas no Html.
Criando o efeito zebra em tabelas com JQuery
Como Estilizar uma Tabela Html com Css.
Publicado por: Loop Nerd
1.815 Visualizações
Deixe um comentário