Tabelas

1.664 visualizações

Publicada em

Aula para o 6to semestre da FAFIT. Aula de HTML sobre tabelas.

Publicada em: Tecnologia
0 comentários
0 gostaram
Estatísticas
Notas
  • Seja o primeiro a comentar

  • Seja a primeira pessoa a gostar disto

Sem downloads
Visualizações
Visualizações totais
1.664
No SlideShare
0
A partir de incorporações
0
Número de incorporações
11
Ações
Compartilhamentos
0
Downloads
19
Comentários
0
Gostaram
0
Incorporações 0
Nenhuma incorporação

Nenhuma nota no slide

Tabelas

  1. 1. Tabelas
  2. 2. Tabelas <ul><li>     Utilizamo-as apenas para mostrar dados tabulares, ex.: excel. Não deve ser usada para ajudar na composição do layout. A não utilização de tabelas para adequar objetos na tela chama-se tableless. </li></ul>
  3. 3. TAGS <ul><li>     Necessitamos basicamente de 3 tags para criar uma tabela: </li></ul><ul><li><table> </li></ul><ul><li>     <tr> </li></ul><ul><li>             <td>  </td> </li></ul><ul><li>                     </li></ul><ul><li>     </tr> </li></ul><ul><li></table> </li></ul>
  4. 4. <table> <ul><li>     Nossa tag <table> serve para começar e finalizar a tabela. Sempre será a primeira a ser aberta e a última a ser fechada. </li></ul>
  5. 5. <tr> <ul><li>     Significa &quot;table row&quot; - linha de tabela - começa e termina e uma linha horizontal da tabela.  </li></ul>
  6. 6. <td> <ul><li>     Significa &quot;table data&quot; - dados da tabela. começa e termina cada célula contida nas linhas da tabela.  </li></ul>
  7. 7. Cabeçalho e rodapé <ul><li>     A tabela nos da capacidade de criarmos cabeçalho e rodapé. Para isso usamos as tags <thead> e <tfooter> não esquecemos de usar <tbody> para o corpo da tabela. </li></ul>
  8. 8. Tabela <ul><li>     A tabela nos da capacidade de criarmos cabeçalho e rodapé. Para isso usamos as tags <thead> e <tfooter> não esquecemos de usar <tbody> para o corpo da tabela. </li></ul>
  9. 9. Tabela <ul><li>ex.: www.suissacorp.com.br/fafit/aula/tabela.html </li></ul>
  10. 10. Atributos <ul><li>background:  permite-nos colocar um fundo para a tabela </li></ul><ul><li>border : define o valor da borda em px </li></ul><ul><li>bordercolor : define a cor da borda </li></ul><ul><li>bgcolor : define a cor de fundo </li></ul><ul><li>width : largura, pode ser em, px ou % </li></ul><ul><li>height : altura, pode ser em, px ou % </li></ul><ul><li>cellpadding : margem interna da célula, em px </li></ul><ul><li>cellspacing : margem externa da célula, em px </li></ul><ul><li>align : alinhamento horizontal </li></ul><ul><li>valign : alinhamento vertical </li></ul><ul><li>colspan : utiliza o espaço setado em colunas </li></ul><ul><li>rowspan : utiliza o espaço setado em linhas </li></ul>
  11. 11. Exercício <ul><li>Fazer uma tabela igual: </li></ul>
  12. 12. Exercício 2 <ul><li>Fazer uma tabela igual: </li></ul>

×