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 3

4

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: