terça-feira, 1 de novembro de 2011

Tabelas em html


Tabelas
Organização de tabelas e a noção de como estruturar um documento utilizando as tags de tabela.
As tabelas são definidas pelas tags <table> </table>. Dentro dessas tags, você deve definir as linhas <tr> </tr> e as colunas <td> </td> da tabela.
Para definir uma tabela com duas linhas e duas colunas, por exemplo, você terá a seguinte estrutura:
<table> - inicializa a tabela
  <tr> - inicializa a primeira linha
    <td> conteúdo da célula </td> - inicializa e fecha coluna da esquerda
    <td> conteúdo da célula </td> - inicializa e fecha a coluna da direita
  </td> - fecha a primeira linha
  <td> - inicializa a segunda linha
    <td> conteúdo da célula </td> - inicializa e fecha a coluna da esquerda
    <td> conteúdo da célula </td> - inicializa e fecha a coluna da direita
  </tr> - fecha a segunda linha
</table> - fecha a tabela
As tags <taable> </table> podem ter os seguintes atributos:
border="n" : define a espessura da borda da tabela, onde n recebe um valor de 1 a 6.
cellspacing="n" : define o espaçamento horizontal entre as células.
cellpadding="n" : define o espaçamento vertical entre as células, sem refletir na largura da borda.
widht="n" : define a largura da tabela em relação à página. Pode ser dada em pixels (width="400") ou em porcentagem (width="80%").
height="n" : define a altura da tabela em relação à página. Pode ser dada em pixels (height="350") ou porcentagem (height="50%").
bgcolor="cor" : define a cor de fundo da tabela. Aqui, você também pode optar por escolher uma imagem como fundo da tabela, com o atributo background="imagem", que receberá um arquivo .gif ou .jpg.
AS tags <td> </td> e <tr> </tr> podem receber atributos também:
aling="alinhamento" : define o alinhamento da célula, que pode ser right, left e center, definindo um alinhamento à direita, à esquerda e ao centro, respectivamente.
valing="alinhamento_vertical" : define o alinhamento vertical da célula, ou seja, a distribuição do texto em relação à página. Esse texto pode ser definido como top, para o topo da célula; middle, para o meio da célula e bottom para a base da célula.
colspan="n" : define o número de colunas a serem agrupadas em uma única célula.
rowspan="n" : define o número de linhas a serem agrupadas em uma única célula.

0 comentários:

Postar um comentário

 
Design by Free WordPress Themes | Bloggerized by Lasantha - Premium Blogger Themes | Best Buy Coupons