Tabela Simples 1x1:
< table> Tabela< /table>
| Tabela |
Tabela 1x2:
< table>
< tr>
< td>L1 C1< /td>
< td>L1 C2< /td>
< /table>
O resultado:
| L1 C1 | L1 C2 |
Tabela 2x2:
< table>
< tr>
< td>L1 C1< /td>
< td>L1 C2< /td>
< tr>
< td>L2 C1< /td>
< td>L2 C2< /td>
< /table>
O resultado é:
| L1 C1 | L1 C2 |
| L2 C1 | L2 C2 |
Dentro da Tag < TABLE> existem SUBTAGS como você viu eu usei < tr>, < td>.
< TR> É justamente o commando que manda os dados para a linha de baixo, no caso de vir logo após a tag < TABLE> ela marca o inicio da entrada de dados na tabela, tento se passado a primeira linha e queremos ir para a segunda linha da tabela simplesmente a colocamos novamente, e assim para irmos para as demais linha que nossa tabela venhaa ter!
< TD> É o comando que passa os dados para a proxima coluna da mesma linha!
Atributos
Além dos atributos específicos de cada célula ou linha, as tabelas podem ser adicionalmente formatadas a partir dos atributos que nos oferece a própria etiqueta < table>. A seguir, mostramos aqueles que nos podem parecer à principio mais importantes:
align Alinha horizontalmente a tabela em relação ao seu entorno.(left, center, right)
background Permite-nos colocar um fundo para a tabela desde um link a uma imagem.
bgcolor Dá cor de fundo à tabela.(tanto em Ingle quanto em HTML)Tabela de cor
border Define o número de pixels da borda principal. Se 0 a tabela exista, mas não aparece!
bordercolor Define a cor da borda.
cellpadding Define, em pixels, o espaço entre as bordas da célula e o conteúdo da mesma.
cellspacing Define o espaço entre as bordas (em pixels).
height Define a altura da tabela em pixels ou porcentagem.
width Define a largura da tabela em pixels ou porcentagem.
Podemos alinha toda nossa tabela usando o atributo ALIGN dentro da tag HTML.
Veja < TABLE align="center">< TR>< TD>dados< /TD>< /TABLE>
o resultado é:
| dados |
Podemos colocar tabela dentro de tabela.
Vamos fazer uma tabela externa 1x2 e uma interna na segunda coluna 3x1 ambas com borda 2.
Ou seja:
< table border="2">
< tr>
< td>Tabela 1< /td>
< td>
< table border="2" bordercolor="yellow" bgcolor="red">
< tr>
< td>1< /td>
< tr>
< td>2< /td>
< tr>
< td>3< /td>
< /table>
< /td>
< /table>
| Tabela 1 |
|