Aula 06 HTML – HyperText Markup Language – Tabelas

Olá Pessoal,

É importante que ao fazer esta aula você já tenha feito as anteriores e conheça as principais tags em HTML.

Então Vamos lá…
Hoje vou falar um pouco sobre TABELAS.

Curso de HTML Aula 06 – Tabelas

Nesta aula vamos falar sobre tabelas em HTML.

No desenvolvimento de websites, por mais simples que seja, é necessário uma maneira de organizar seus conteúdos e ajustar seu website. Para isto, usamos as famosas TABELAS. Vou explicar passo a passo como criar a sua sem a necessidade de qualquer programa que desenvolva páginas.

Para isto, vamos precisar do Bloco de notas, isto mesmo! O bloco de notas do Windows. Ou qualquer programa editor de textos simples que você tenha instalado em seu computador.

Tags Principais

// Estas tags definem o inicio e o fim de uma tabela

Toda tabela tem linhas e colunas…

A tag para linhas é:



E para as colunas é:



Exemplo de tabela:


Célula 1
Célula 2


Célula 3
Célula 4


Qual a diferença entre e ?
Como você deve ter visto no exemplo acima, este foi o código HTML mais complicado que escrevemos até agora. Vamos analisar isto por partes e explicar as diferentes tags:

3 tags básicas são usadas para inserir tabelas:

começa e termina uma tabela. Evidente.
significa “table row” – linha de tabela – começa e termina e uma linha horizontal da tabela. Também evidente.
significa “table data” – dados da tabela. começa e termina cada célula contida nas linhas da tabela. Tudo simples e evidente.
Eis o acontece no Exemplo 1: a tabela começa com , segue-se uma , que indica o início de uma nova linha. Duas células são então inseridas na linha: Célula 1 e Célula 2 . A linha termina com e uma nova linha começa imediatamente a seguir. A nova linha também contém duas células. A tabela termina com .

Atributos de Uma Tabela:

Border: que é usado para definir a espessura de uma borda em volta da tabela

Align: define o alinhamento horizontal do conteúdo da tabela, de uma linha ou de uma célula. Por exemplo, left, center ou right (à esquerda, no centro ou à direita).
Valign: define o alinhamento vertical do conteúdo de uma célula. Por exemplo, top, middle ou bottom (em cima, no meio ou em baixo).

Para melhorar seus estudos clique no link confira http://www.ancibe.com.br/html/tabelas.html mais detalhes do que você pode fazer com tabelas.

Lembrado todos que participarem deste curso e comentarem em todoas as aulas receberão GRATUITAMENTE UM CERTIFICADO DE PARTICIPAÇÃO.

Confira a vídeo aula:

Slides desta aula:

Como Fazer tabelas em HTML from Tales Augusto

Valeu e até a proxíma!
Fonte: http://www.codigofonte.net/dicas/html/127_criando-tabelas-em-html