segunda-feira, 30 de janeiro de 2012

Criando tabelas em html ( tag table)

Ola pessoal, vamos a mas um post!

Vou explicar como funciona a tabela em html

A tabela em html tem a finalidade de organizar conteúdos dentro de sua pagina.
Para utilizar a tabela usamos a tag <table> </table> e dentro dela temos que colocar mais 2 tags:

<tr> </tr>  ( significa linha )
<td> </td> ( significa coluna )

Vamos a um exemplo. Vou montar uma tabela com 2 linhas e 2 colunas em cada linha.
Abra o bloco de notas e digite esse código:

<html>
<body>
<table>
   <tr>
       <td> 1 </td>
       <td> 2 </td>
   </tr>
   <tr>
       <td> 1 </td>
       <td> 2 </td>
   </tr>
</table>
</body>
</html>

Salve como tabela.html

Abra o arquivo salvo e ele vai mostrar isso:



Agora vamos aprimorar nossa tabela com alguns atributos
Dentro da tabela usamos alguns códigos para deixar com a aparência mais arrojada, vou listar alguns:

Border (significa borda)
Bgcolor (significa plano de fundo)
Cellsapacing (significa espaços entre as células)
Cellpadding (significa espaços entre a borda da célula)


Vamos aprimorar nosso exemplo. Vou colocar uma borda de tamanho 3, cor de fundo verde, espaço entre as células de tamanho 4 e espaço entre a borda de tamanho 3

<html>
<body>
<table border=”3” bgcolor=”green” cellspacing=”4” cellpadding=“3”>
   <tr>
       <td> 1 </td>
       <td> 2 </td>
   </tr>
   <tr>
       <td> 1 </td>
       <td> 2 </td>
   </tr>
</table>
</body>
</html>


O seu html ficara assim:



Então pessoal, é isso ai, nos próximos post falaremos mais sobre a tabela
Obrigado pessoal, até o próximo

Nenhum comentário:

Postar um comentário