SlideShare une entreprise Scribd logo
1  sur  11
Télécharger pour lire hors ligne
DESENVOLVIMENTO DE APLICAÇÕES PARA WEB
PROF. ANDRÉ COSTA
HTML - Tabela
andre.costa@pro.unifacs.br
HTML	
  -­‐	
  Tabela	
  
<table	
  border=“1”>	
  
	
  	
  	
  	
  	
  	
  <tr>	
  
	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  <td>Linha	
  1,	
  Coluna	
  1</td>	
  
	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  <td>Linha	
  1,	
  Coluna	
  2</td>	
  
	
  	
  	
  	
  	
  	
  </tr>	
  
	
  	
  	
  	
  	
  	
  <tr>	
  
	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  <td>Linha	
  2,	
  Coluna	
  1</td>	
  
	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  <td>Linha	
  2,	
  Coluna	
  2</td>	
  
	
  	
  	
  	
  	
  	
  </tr>	
  
</table>	
  
HTML	
  -­‐	
  Tabela	
  
<table	
  border=“1”>	
  
	
  	
  	
  	
  	
  	
  <tr>	
  
	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  <th>Linha	
  1,	
  Coluna	
  1</th>	
  
	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  <th>Linha	
  1,	
  Coluna	
  2</th>	
  
	
  	
  	
  	
  	
  	
  </tr>	
  
	
  	
  	
  	
  	
  	
  <tr>	
  
	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  <td>Linha	
  2,	
  Coluna	
  1</td>	
  
	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  <td>Linha	
  2,	
  Coluna	
  2</td>	
  
	
  	
  	
  	
  	
  	
  </tr>	
  
</table>	
  
HTML	
  -­‐	
  Tabela	
  
<table	
  border=“1”>	
  
	
  	
  	
  	
  	
  	
  <tr>	
  
	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  <td	
  colspan=“2”>Linha	
  1,	
  Coluna	
  1</td>	
  	
  	
  	
  	
  	
  </tr>	
  
	
  	
  	
  	
  	
  	
  <tr>	
  
	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  <td>Linha	
  2,	
  Coluna	
  1</td>	
  
	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  <td>Linha	
  2,	
  Coluna	
  2</td>	
  
	
  	
  	
  	
  	
  	
  </tr>	
  
</table>	
  
HTML	
  -­‐	
  Tabela	
  
<table	
  border=“1”>	
  
	
  	
  	
  	
  	
  	
  <tr>	
  
	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  <td	
  rowspan=“2”>Linha	
  1,	
  Coluna	
  1</td>	
  
	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  <td>Linha	
  1,	
  Coluna	
  2</td>	
  
	
  	
  	
  	
  	
  	
  </tr>	
  
	
  	
  	
  	
  	
  	
  <tr>	
  
	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  <td>Linha	
  2,	
  Coluna	
  2</td>	
  
	
  	
  	
  	
  	
  	
  </tr>	
  
</table>	
  
HTML	
  -­‐	
  Tabela	
  
<table	
  border=“1”	
  width=“100%”	
  height=“200px”	
  align=“leA”	
  valign=“top”>	
  
<tr>	
  
	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  <td>Linha	
  1,	
  Coluna	
  1</td>	
  
	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  <td>Linha	
  1,	
  Coluna	
  2</td>	
  
	
  	
  	
  	
  	
  	
  </tr>	
  
	
  	
  	
  	
  	
  	
  <tr>	
  
	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  <td>Linha	
  2,	
  Coluna	
  1</td>	
  
	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  <td>Linha	
  2,	
  Coluna	
  2</td>	
  
	
  	
  	
  	
  	
  	
  </tr>	
  
</table>	
  
HTML	
  -­‐	
  Tabela	
  
Mão	
  na	
  massa!	
  	
  
Desenvolva	
  em	
  HTML	
  a	
  seguinte	
  tabela:	
  
1 2 3
4 5 6
7 8 9
HTML	
  -­‐	
  Tabela	
  
Mão	
  na	
  massa!	
  	
  
Desenvolva	
  em	
  HTML	
  a	
  seguinte	
  tabela:	
  
1 2 3
4
7 8 9
HTML	
  -­‐	
  Tabela	
  
Mão	
  na	
  massa!	
  	
  
Desenvolva	
  em	
  HTML	
  a	
  seguinte	
  tabela:	
  
1 2
34
5 6
HTML	
  -­‐	
  Tabela	
  
Mão	
  na	
  massa!	
  	
  
Desenvolva	
  o	
  layout	
  de	
  um	
  site	
  uJlizando	
  
tabela:	
  
HTML	
  -­‐	
  Tabela	
  
A2vidade	
  do	
  Desafio	
  
Desenvolva	
  as	
  3	
  tabelas	
  abaixo	
  em	
  um	
  único	
  
arquivo	
  HTML:	
  

Contenu connexe

Tendances

Plano de curso introdução a computação
Plano de curso   introdução a computaçãoPlano de curso   introdução a computação
Plano de curso introdução a computaçãoFelipe Pereira
 
Curso de css3 unidade 1 - introdução ao css
Curso de css3   unidade 1 - introdução ao cssCurso de css3   unidade 1 - introdução ao css
Curso de css3 unidade 1 - introdução ao cssLéo Dias
 
noções de sgdb
noções de sgdbnoções de sgdb
noções de sgdbPaulo Reis
 
Introdução ao Desenvolvimento Android
Introdução ao Desenvolvimento AndroidIntrodução ao Desenvolvimento Android
Introdução ao Desenvolvimento AndroidJosé Alexandre Macedo
 
Trabalho fddi
Trabalho fddiTrabalho fddi
Trabalho fddiKeynom
 
Arquitetura básica de um computador
Arquitetura básica de um computadorArquitetura básica de um computador
Arquitetura básica de um computadorNécio de Lima Veras
 
Os Direitos dos Animais
Os Direitos dos AnimaisOs Direitos dos Animais
Os Direitos dos Animaisjorgina8
 
Jogo da forca - Diagrama de Classe
Jogo da forca - Diagrama de ClasseJogo da forca - Diagrama de Classe
Jogo da forca - Diagrama de ClasseDaniela Carvalho
 
Modelo Conceitual
Modelo ConceitualModelo Conceitual
Modelo Conceitualkottrim
 
HABILIDADES BNCC ED FIS.pdf
HABILIDADES BNCC ED FIS.pdfHABILIDADES BNCC ED FIS.pdf
HABILIDADES BNCC ED FIS.pdfJasmimFlor
 

Tendances (20)

Computação Gráfica
Computação GráficaComputação Gráfica
Computação Gráfica
 
Plano de curso introdução a computação
Plano de curso   introdução a computaçãoPlano de curso   introdução a computação
Plano de curso introdução a computação
 
2. Tipos de mídia
2. Tipos de mídia2. Tipos de mídia
2. Tipos de mídia
 
Lajes
LajesLajes
Lajes
 
Pilar canto
Pilar cantoPilar canto
Pilar canto
 
Curso de css3 unidade 1 - introdução ao css
Curso de css3   unidade 1 - introdução ao cssCurso de css3   unidade 1 - introdução ao css
Curso de css3 unidade 1 - introdução ao css
 
Paradigma culturológico
Paradigma culturológicoParadigma culturológico
Paradigma culturológico
 
Princesas africanas livros
Princesas africanas   livrosPrincesas africanas   livros
Princesas africanas livros
 
noções de sgdb
noções de sgdbnoções de sgdb
noções de sgdb
 
Produção do concreto
Produção do concreto Produção do concreto
Produção do concreto
 
Introdução ao Desenvolvimento Android
Introdução ao Desenvolvimento AndroidIntrodução ao Desenvolvimento Android
Introdução ao Desenvolvimento Android
 
Trabalho fddi
Trabalho fddiTrabalho fddi
Trabalho fddi
 
Arquitetura básica de um computador
Arquitetura básica de um computadorArquitetura básica de um computador
Arquitetura básica de um computador
 
Os Direitos dos Animais
Os Direitos dos AnimaisOs Direitos dos Animais
Os Direitos dos Animais
 
Meios de transmissao
Meios de transmissaoMeios de transmissao
Meios de transmissao
 
Volume2006a
Volume2006aVolume2006a
Volume2006a
 
Jogo da forca - Diagrama de Classe
Jogo da forca - Diagrama de ClasseJogo da forca - Diagrama de Classe
Jogo da forca - Diagrama de Classe
 
Projeto de redes
Projeto de redesProjeto de redes
Projeto de redes
 
Modelo Conceitual
Modelo ConceitualModelo Conceitual
Modelo Conceitual
 
HABILIDADES BNCC ED FIS.pdf
HABILIDADES BNCC ED FIS.pdfHABILIDADES BNCC ED FIS.pdf
HABILIDADES BNCC ED FIS.pdf
 

En vedette

Aula 1 apresentação + html (tags)
Aula 1   apresentação + html (tags)Aula 1   apresentação + html (tags)
Aula 1 apresentação + html (tags)andreluizlc
 
Aula 1 apresentação + html (tags)
Aula 1   apresentação + html (tags)Aula 1   apresentação + html (tags)
Aula 1 apresentação + html (tags)andreluizlc
 
Wordpress, Guia/Manual do Publicador
Wordpress, Guia/Manual do PublicadorWordpress, Guia/Manual do Publicador
Wordpress, Guia/Manual do PublicadorRenato Vieira
 
Como criar um blog - Usando o wordpress no seu próprio domínio
Como criar um blog - Usando o wordpress no seu próprio domínioComo criar um blog - Usando o wordpress no seu próprio domínio
Como criar um blog - Usando o wordpress no seu próprio domínioBeto Tercette
 
1ª aula introdução a informática
1ª aula introdução a informática1ª aula introdução a informática
1ª aula introdução a informáticasocrahn
 

En vedette (8)

Aula 1 apresentação + html (tags)
Aula 1   apresentação + html (tags)Aula 1   apresentação + html (tags)
Aula 1 apresentação + html (tags)
 
Aula 1 apresentação + html (tags)
Aula 1   apresentação + html (tags)Aula 1   apresentação + html (tags)
Aula 1 apresentação + html (tags)
 
Wordpress, Guia/Manual do Publicador
Wordpress, Guia/Manual do PublicadorWordpress, Guia/Manual do Publicador
Wordpress, Guia/Manual do Publicador
 
HTML - Tabelas
HTML - TabelasHTML - Tabelas
HTML - Tabelas
 
Como criar um blog - Usando o wordpress no seu próprio domínio
Como criar um blog - Usando o wordpress no seu próprio domínioComo criar um blog - Usando o wordpress no seu próprio domínio
Como criar um blog - Usando o wordpress no seu próprio domínio
 
Wordpress para iniciantes
Wordpress para iniciantesWordpress para iniciantes
Wordpress para iniciantes
 
Html Exercicio
Html ExercicioHtml Exercicio
Html Exercicio
 
1ª aula introdução a informática
1ª aula introdução a informática1ª aula introdução a informática
1ª aula introdução a informática
 

Similaire à Aula 2 html (tabela)

Resumos html
Resumos htmlResumos html
Resumos htmlesaf
 
AULA 2 - UTILIZAÇÃO DE TABELAS
AULA 2 - UTILIZAÇÃO DE TABELASAULA 2 - UTILIZAÇÃO DE TABELAS
AULA 2 - UTILIZAÇÃO DE TABELASdiogolevel3
 
HTML&CSS 2 - Intermediate HTML
HTML&CSS 2 - Intermediate HTMLHTML&CSS 2 - Intermediate HTML
HTML&CSS 2 - Intermediate HTMLDinis Correia
 

Similaire à Aula 2 html (tabela) (7)

Html (tabela)
Html (tabela)Html (tabela)
Html (tabela)
 
Html tabela
Html   tabelaHtml   tabela
Html tabela
 
05 html tabelas
05 html   tabelas05 html   tabelas
05 html tabelas
 
Html - introdução e exemplos
Html - introdução e exemplosHtml - introdução e exemplos
Html - introdução e exemplos
 
Resumos html
Resumos htmlResumos html
Resumos html
 
AULA 2 - UTILIZAÇÃO DE TABELAS
AULA 2 - UTILIZAÇÃO DE TABELASAULA 2 - UTILIZAÇÃO DE TABELAS
AULA 2 - UTILIZAÇÃO DE TABELAS
 
HTML&CSS 2 - Intermediate HTML
HTML&CSS 2 - Intermediate HTMLHTML&CSS 2 - Intermediate HTML
HTML&CSS 2 - Intermediate HTML
 

Plus de andreluizlc

Aula 6. trabalho da disciplina
Aula 6. trabalho da disciplinaAula 6. trabalho da disciplina
Aula 6. trabalho da disciplinaandreluizlc
 
Aula 5. frameworks mobile
Aula 5. frameworks mobileAula 5. frameworks mobile
Aula 5. frameworks mobileandreluizlc
 
Aula 4. bibliotecas js
Aula 4. bibliotecas jsAula 4. bibliotecas js
Aula 4. bibliotecas jsandreluizlc
 
Aula 3. frameworks front end
Aula 3. frameworks front endAula 3. frameworks front end
Aula 3. frameworks front endandreluizlc
 
Aula 2. frameworks js
Aula 2. frameworks jsAula 2. frameworks js
Aula 2. frameworks jsandreluizlc
 
Aula 1. apresentação + frameworks
Aula 1. apresentação + frameworksAula 1. apresentação + frameworks
Aula 1. apresentação + frameworksandreluizlc
 
Html formulário
Html   formulárioHtml   formulário
Html formulárioandreluizlc
 
Apresentação e Introdução ao HTML
Apresentação e Introdução ao HTMLApresentação e Introdução ao HTML
Apresentação e Introdução ao HTMLandreluizlc
 
Apresentação + html (tags)
Apresentação + html (tags)Apresentação + html (tags)
Apresentação + html (tags)andreluizlc
 

Plus de andreluizlc (20)

Aula 6. trabalho da disciplina
Aula 6. trabalho da disciplinaAula 6. trabalho da disciplina
Aula 6. trabalho da disciplina
 
Aula 5. frameworks mobile
Aula 5. frameworks mobileAula 5. frameworks mobile
Aula 5. frameworks mobile
 
Aula 4. bibliotecas js
Aula 4. bibliotecas jsAula 4. bibliotecas js
Aula 4. bibliotecas js
 
Aula 3. frameworks front end
Aula 3. frameworks front endAula 3. frameworks front end
Aula 3. frameworks front end
 
Aula 2. frameworks js
Aula 2. frameworks jsAula 2. frameworks js
Aula 2. frameworks js
 
Aula 1. apresentação + frameworks
Aula 1. apresentação + frameworksAula 1. apresentação + frameworks
Aula 1. apresentação + frameworks
 
PHP
PHPPHP
PHP
 
Feriado
FeriadoFeriado
Feriado
 
Atividade
AtividadeAtividade
Atividade
 
Avaliação
AvaliaçãoAvaliação
Avaliação
 
Js
JsJs
Js
 
Css
CssCss
Css
 
Html formulário
Html   formulárioHtml   formulário
Html formulário
 
Apresentação e Introdução ao HTML
Apresentação e Introdução ao HTMLApresentação e Introdução ao HTML
Apresentação e Introdução ao HTML
 
Apresentação + html (tags)
Apresentação + html (tags)Apresentação + html (tags)
Apresentação + html (tags)
 
CSS
CSSCSS
CSS
 
Trabalho
TrabalhoTrabalho
Trabalho
 
Revisão
RevisãoRevisão
Revisão
 
Prática
PráticaPrática
Prática
 
PHP
PHPPHP
PHP
 

Aula 2 html (tabela)

  • 1. DESENVOLVIMENTO DE APLICAÇÕES PARA WEB PROF. ANDRÉ COSTA HTML - Tabela andre.costa@pro.unifacs.br
  • 2. HTML  -­‐  Tabela   <table  border=“1”>              <tr>                          <td>Linha  1,  Coluna  1</td>                            <td>Linha  1,  Coluna  2</td>              </tr>              <tr>                          <td>Linha  2,  Coluna  1</td>                          <td>Linha  2,  Coluna  2</td>              </tr>   </table>  
  • 3. HTML  -­‐  Tabela   <table  border=“1”>              <tr>                          <th>Linha  1,  Coluna  1</th>                            <th>Linha  1,  Coluna  2</th>              </tr>              <tr>                          <td>Linha  2,  Coluna  1</td>                          <td>Linha  2,  Coluna  2</td>              </tr>   </table>  
  • 4. HTML  -­‐  Tabela   <table  border=“1”>              <tr>                          <td  colspan=“2”>Linha  1,  Coluna  1</td>            </tr>              <tr>                          <td>Linha  2,  Coluna  1</td>                          <td>Linha  2,  Coluna  2</td>              </tr>   </table>  
  • 5. HTML  -­‐  Tabela   <table  border=“1”>              <tr>                          <td  rowspan=“2”>Linha  1,  Coluna  1</td>                            <td>Linha  1,  Coluna  2</td>              </tr>              <tr>                              <td>Linha  2,  Coluna  2</td>              </tr>   </table>  
  • 6. HTML  -­‐  Tabela   <table  border=“1”  width=“100%”  height=“200px”  align=“leA”  valign=“top”>   <tr>                          <td>Linha  1,  Coluna  1</td>                            <td>Linha  1,  Coluna  2</td>              </tr>              <tr>                          <td>Linha  2,  Coluna  1</td>                          <td>Linha  2,  Coluna  2</td>              </tr>   </table>  
  • 7. HTML  -­‐  Tabela   Mão  na  massa!     Desenvolva  em  HTML  a  seguinte  tabela:   1 2 3 4 5 6 7 8 9
  • 8. HTML  -­‐  Tabela   Mão  na  massa!     Desenvolva  em  HTML  a  seguinte  tabela:   1 2 3 4 7 8 9
  • 9. HTML  -­‐  Tabela   Mão  na  massa!     Desenvolva  em  HTML  a  seguinte  tabela:   1 2 34 5 6
  • 10. HTML  -­‐  Tabela   Mão  na  massa!     Desenvolva  o  layout  de  um  site  uJlizando   tabela:  
  • 11. HTML  -­‐  Tabela   A2vidade  do  Desafio   Desenvolva  as  3  tabelas  abaixo  em  um  único   arquivo  HTML: