05 01 tabelas
-
Upload
vasco-ferreira -
Category
Engineering
-
view
67 -
download
1
Transcript of 05 01 tabelas
![Page 1: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/1.jpg)
TABELAS
HTML
![Page 2: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/2.jpg)
ELEMENTOS
<TABLE><TR><TD></TABLE>
INICIO DA TABELA
FIM DA TABELA
![Page 3: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/3.jpg)
ELEMENTOS
<TABLE><TR><TD></TABLE>
INICIO DE UMA LINHA DA TABELA(TABLE ROW = <TR>)
![Page 4: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/4.jpg)
ELEMENTOS
<TABLE><TR><TD>Célula 1</TD></TR></TABLE>
Conteúdo de uma célulaTD = TABLE DATA
![Page 5: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/5.jpg)
ELEMENTOS
<TABLE><TR><TD>Célula 1</TD><TD>Célula 2</TD></TR></TABLE>
INICIO DE UMA LINHA DA TABELA
![Page 6: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/6.jpg)
ELEMENTOS<TABLE><TR><TD>Célula 1</TD><TD>Célula 2</TD></TR><TR><TD>Célula 3</TD><TD>Célula 4</TD></TR>
</TABLE>
![Page 7: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/7.jpg)
Exercício
Crie a seguinte tabela:
Janeiro 100
Mês Poupança
Fevereiro 110
![Page 8: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/8.jpg)
Exercício
Crie a seguinte tabela:
Janeiro 100
Mês Poupança
Fevereiro 110
Substituir:<td>Mês</td>Por<th>Mês</th>
![Page 9: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/9.jpg)
ATRIBUTOS
DAS CÈLULAS ou da TABELA
ALIGN• Left• Center• Right
<html><table border=“1” align=“right”> <tr>
<th>Mês</th><th>Poupança</th>
</tr><tr>
<td>Janeiro</td><td>100 Eur</td>
</tr><tr>
<td>Fevereiro</td><td>70 Eur</td>
</tr></table></html>
![Page 10: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/10.jpg)
ATRIBUTOSDA TABELA• BORDER=“NONE”• BORDER=n
<html><table border=“1” align=“right”> <tr>
<th>Mês</th><th>Poupança</th>
</tr><tr>
<td>Janeiro</td><td>100 Eur</td>
</tr><tr>
<td>Fevereiro</td><td>70 Eur</td>
</tr></table></html>
![Page 11: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/11.jpg)
ATRIBUTOSDA TABELA• ALIGN=“RIGHT”• ALIGN=“CENTER”• ALIGN=“LEFT”
<html><table border=“1” align=“right”> <tr>
<th>Mês</th><th>Poupança</th>
</tr><tr>
<td>Janeiro</td><td>100 Eur</td>
</tr><tr>
<td>Fevereiro</td><td>70 Eur</td>
</tr></table></html>
![Page 12: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/12.jpg)
ATRIBUTOS<html><table border=“1” align=“right”> <tr>
<th>Mês</th><th>Poupança</th>
</tr><tr>
<td>Janeiro</td><td>100 Eur</td>
</tr><tr>
<td>Fevereiro</td><td>70 Eur</td>
</tr></table></html>
Th = Table Header
![Page 13: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/13.jpg)
ATRIBUTOSDAS CÉLULAS• Th• Td
<html><table border=“1” align=“right”> <tr>
<th>Mês</th><th>Poupança</th>
</tr><tr>
<td>Janeiro</td><td>100 Eur</td>
</tr><tr>
<td>Fevereiro</td><td>70 Eur</td>
</tr></table></html>
Th = Table Header
Td = Table Data
![Page 14: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/14.jpg)
ATRIBUTOSDAS CÉLULAS• Th• Td
<html><table border=“1” align=“right”> <tr>
<th>Mês</th><th>Poupança</th>
</tr><tr>
<td>Janeiro</td><td>100 Eur</td>
</tr><tr>
<td>Fevereiro</td><td>70 Eur</td>
</tr></table></html>
TD = Table Data
![Page 15: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/15.jpg)
ATRIBUTOSDAS CÉLULAS• Th• Td
<html><table border=“1” align=“right”> <tr>
<th>Mês</th><th>Poupança</th>
</tr><tr>
<td>Janeiro</td><td>100 Eur</td>
</tr><tr>
<td>Fevereiro</td><td>70 Eur</td>
</tr></table></html>
<TR> = TABLE ROW = LINHA DA TABELA
![Page 16: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/16.jpg)
ATRIBUTOSDAS CÉLULAS• Th• Td
<html><table border=“1” align=“right”> <tr>
<th>Mês</th><th>Poupança</th>
</tr><tr>
<td>Janeiro</td><td>100 Eur</td>
</tr><tr>
<td>Fevereiro</td><td>70 Eur</td>
</tr></table></html>
<TR>= Nova linha da Tabela
![Page 17: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/17.jpg)
<html><table border=“1” align=“right”> <tr>
<th>Mês</th><th>Poupança</th>
</tr><tr>
<td>Janeiro</td><td>100 Eur</td>
</tr><tr>
<td>Fevereiro</td><td>70 Eur</td>
</tr></table></html>
ATRIBUTOSDAS CÉLULAS• Th• Td
1ª e 2ª Célula da 2ª Linha
![Page 18: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/18.jpg)
<html><table border=“1” align=“right”> <tr>
<th>Mês</th><th>Poupança</th>
</tr><tr>
<td>Janeiro</td><td>100 Eur</td>
</tr><tr>
<td>Fevereiro</td><td>70 Eur</td>
</tr></table></html>
ATRIBUTOSDAS CÉLULAS• Th• Td
Fim da 2ª Linha
![Page 19: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/19.jpg)
<html><table border=“1” align=“right”> <tr>
<th>Mês</th><th>Poupança</th>
</tr><tr>
<td>Janeiro</td><td>100 Eur</td>
</tr><tr>
<td>Fevereiro</td><td>70 Eur</td>
</tr></table></html>
ATRIBUTOSDAS CÉLULAS• Th• Td
Fim da Tabela
![Page 20: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/20.jpg)
ExercícioCrie a seguinte tabela com e sem linhas:
![Page 21: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/21.jpg)
Solução<table cellspacing="0" cellpadding="3" border="1" width="400"
align="center"> <tr>
<td colspan="2" align="center"><font size="5"><b><i>Fresh Fruits</i></b></font>
</td> </tr> <tr> <td>It has long been known that a diet that includes at least a few servings of
fresh fruit every day will help keep you healthy, fit and trim.</td> <td><img src="fruitbowl.gif" width="170" height="91" border="0"
alt="Fruitbowl"></td> </tr> </table>
![Page 22: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/22.jpg)
CABEÇALHOS HORIZONTAIS<table border="1"><tr> <th>Name</th> <th>Telephone</th> <th>Telephone</th></tr><tr> <td>Bill Gates</td> <td>555 77 854</td> <td>555 77 855</td></tr></table>
![Page 23: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/23.jpg)
CABEÇALHOS VERTICAIS<table border="1"><tr> <th>First Name:</th> <td>Bill Gates</td></tr><tr> <th>Telephone:</th> <td>555 77 854</td></tr><tr> <th>Telephone:</th> <td>555 77 855</td></tr></table>
![Page 24: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/24.jpg)
THEAD, TFOOT, TBODY<body >
<table border=1 rules="groups">
<thead><tr><th>Nome</th><th>Apelido</th></tr></thead>
<tbody><tr><td>Jorge</td><td>Borges</td></tr><tr><td>Lois</td><td>Griffin</td></tr><tr></tbody>
<tfoot><th>Julio</
th><th>Ferreira
</th></tfoot></table></body>
![Page 25: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/25.jpg)
ATRIBUTOS• BORDER• BORDER = NONE• BORDER = VALOR
<TABLE BORDER>
![Page 26: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/26.jpg)
ATRIBUTOS• BORDER• BORDER = NONE• BORDER = VALOR
CELLSPACING – ESPAÇO ENTRE AS CÉLULAS DA TABELA
<TABLE BORDER CELLSPACING=2> <TABLE BORDER CELLSPACING=10>
![Page 27: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/27.jpg)
ATRIBUTOS• BORDER• BORDER = NONE• BORDER = VALOR
CELLPADDING – ESPAÇO ENTRE AS CÉLULAS DA TABELA
<TABLE BORDER CELLPADDING=1> <TABLE BORDER CELLPADDING=10>
![Page 28: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/28.jpg)
ATRIBUTOS
• ColSpan – nº de colunas ocupadas por uma célula
• RowSpan – nº de linhas ocupadas por uma célula
Colspan=2
Colspan=2
![Page 29: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/29.jpg)
ATRIBUTOS<TABLE BORDER=2 CELLPADDING=4><TR> <TH COLSPAN=2>Production</TH> </TR> <TR> <TD>Raha Mutisya</TD> <TD>1493</TD> </TR> <TR> <TD>Shalom Buraka</TD> <TD>3829</TD> </TR> <TR> <TD>Brandy Davis</TD> <TD>0283</TD> </TR> <TR> <TH COLSPAN=2>Sales</TH> </TR><TR> <TD>Claire Horne</TD> <TD>4827</TD> </TR> <TR> <TD>Bruce Eckel</TD> <TD>7246</TD> </TR> <TR> <TD>Danny Zeman</TD> <TD>5689</TD> </TR> </TABLE>
Colspan=2
Colspan=2
![Page 30: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/30.jpg)
MUDAR COR FUNDO CÉLULA<TABLE BORDER=2 CELLPADDING=4><TR> <TH COLSPAN=2 BGCOLOR="#99CCFF">Production</TH> </TR> <TR> <TD>Raha Mutisya</TD> <TD>1493</TD> </TR> <TR> <TD>Shalom Buraka</TD> <TD>3829</TD> </TR> <TR> <TD>Brandy Davis</TD> <TD>0283</TD> </TR> <TR> <TH COLSPAN=2 BGCOLOR="#99CCFF">Sales</TH> </TR><TR> <TD>Claire Horne</TD> <TD>4827</TD> </TR> <TR> <TD>Bruce Eckel</TD> <TD>7246</TD> </TR> <TR> <TD>Danny Zeman</TD> <TD>5689</TD> </TR> </TABLE>
![Page 31: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/31.jpg)
ROWSPAN<TABLE BORDER=2 CELLPADDING=4><TR> <TH ROWSPAN=3 BGCOLOR="#99CCFF">Production</TH><TD>Raha Mutisya</TD> <TD>1493</TD> </TR> <TR> <TD>Shalom Buraka</TD> <TD>3829</TD> </TR> <TR> <TD>Brandy Davis</TD> <TD>0283</TD> </TR> <TR> <TH ROWSPAN=3 BGCOLOR="#99CCFF">Sales</TH> <TD>Claire Horne</TD> <TD>4827</TD> </TR><TR> <TD>Bruce Eckel</TD> <TD>7246</TD> </TR> <TR> <TD>Danny Zeman</TD> <TD>5689</TD> </TR> </TABLE>
![Page 32: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/32.jpg)
Tabela dentro de Tabela
![Page 33: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/33.jpg)
Tabela dentro de Tabela
Tabela Principal
![Page 34: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/34.jpg)
Tabela dentro de Tabela
Tabela Interior
![Page 35: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/35.jpg)
Tabela dentro de Tabela<table border="1"><tr> <td> <p>This is a paragraph</p> <p>This is another paragraph</p> </td> <td>This cell contains a table: <table border="1"> <tr> <td>A</td> <td>B</td> </tr> <tr> <td>C</td> <td>D</td> </tr> </table> </td></tr><tr> <td>This cell contains a list <ul> <li>apples</li> <li>bananas</li> <li>pineapples</li> </ul> </td> <td>HELLO</td></tr></table>
![Page 36: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/36.jpg)
Tabela dentro de Tabela<table border="1"><tr> <td> <p>This is a paragraph</p> <p>This is another paragraph</p> </td> <td>This cell contains a table: <table border="1"> <tr> <td>A</td> <td>B</td> </tr> <tr> <td>C</td> <td>D</td> </tr> </table> </td></tr><tr> <td>This cell contains a list <ul> <li>apples</li> <li>bananas</li> <li>pineapples</li> </ul> </td> <td>HELLO</td></tr></table>
![Page 37: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/37.jpg)
TABLE BORDERS<TABLE BORDER>
<TABLE BORDER=10>
![Page 38: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/38.jpg)
TABLE CAPTION<table border="1"> <caption>Monthly savings</caption> <tr> <th>Month</th> <th>Savings</th> </tr> <tr> <td>January</td> <td>$100</td> </tr> <tr> <td>February</td> <td>$50</td> </tr></table>
![Page 39: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/39.jpg)
Exercício
![Page 40: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/40.jpg)
ExercícioTR
21
34567
![Page 41: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/41.jpg)
ExercícioTD
61
66666
37
![Page 42: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/42.jpg)
ExercícioTD Colspan=6
![Page 43: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/43.jpg)
Exercício<table cellspacing="0" cellpadding="2"
border="3" > <tr> <td align="center" colspan="6">
![Page 44: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/44.jpg)
ExercícioTD Colspan=6
![Page 45: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/45.jpg)
Exercício<tr> <td align="center" colspan="6">
<font size="5"><i><b>My tech stock picks</b></i></font></td>
</tr>
![Page 46: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/46.jpg)
Exercício
TR TD TD TD TD TD TD
![Page 47: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/47.jpg)
Exercício<tr> <td><font size="2"><b>NAME</b></font></td> <td align="center"><font size="2"><b>SYMBOL</b></font></td> <td align="center"><font size="2"><b>CURRENT</b></font></td> <td align="center"><font size="2"><b>52WK HI</b></font></td> <td align="center"><font size="2"><b>52WK LO</b></font></td> <td align="center"><font size="2"><b>P/E RATIO</b></font></td> </tr>
![Page 48: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/48.jpg)
Exercício
TR
TD TD TD TD TD TD
![Page 49: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/49.jpg)
Exercício<tr> <td>Microsoft</td> <td align="center">MSFT</td><td align="center">86-3/8</td><td align="center">119-15/16</td><td align="center">75-1/2</td><td align="center">56.09</td> </tr>
<tr> <td>Cisco Systems</td> <td align="center">CSCO</td><td align="center">72-1/8</td> <td align="center">82</td> <td align="center">24-13/16</td> <td align="center">400.69</td> </tr>
![Page 50: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/50.jpg)
Exercício
<tr> <td>America Online</td> <td align="center">AOL</td> <td align="center">63</td> <td align="center">95-13/16</td> <td align="center">38-15/32</td> <td align="center">350.00</td> </tr>
![Page 51: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/51.jpg)
Exercício
<tr> <td>Qwest Communications</td> <td align="center">Q</td> <td align="center">44-7/16</td> <td align="center">66</td> <td align="center">25-3/4</td> <td align="center">74.06</td> </tr>
![Page 52: 05 01 tabelas](https://reader030.fdocuments.net/reader030/viewer/2022012910/55c1c9debb61eb93298b469e/html5/thumbnails/52.jpg)
Exercício
<tr> <td>Dell Computers</td> <td align="center">DELL</td> <td align="center">53-59/64</td> <td align="center">59-11/16</td> <td align="center">31-3/8</td> <td align="center">86.97</td> </tr> </table>