|
Menu da Seção |
|
Tabelas |
Comandos :
<TABLE>
Inicia uma Tabela
</TABLE>
Finaliza uma tabela
Atributos de TABLE:
<BORDER>
Aparece
jundo que a tag <table>, caso não apareça a tabela não terá bordas. Ela
Desenha bordas ao redor de uma tabela.
Ex:
<TABLE BORDER=2>
Quanto maior o
valor, mais grossa será a linha.
<CELLSPACING> Espaçamento entre as células da
tabela
<CELLPADDING> Espaçamento entre as colunas e
linhas da tabela.
<WIDTH> Largura da tabela.
Comandos dentro de TABLE:
<TR></TR>
Cada
linha de uma tabela deve sempre aparecer entre as marcações <tr> e
</tr>. (TR = Table
Row)
<TD></TD>
Esta
é a marcação que define cada célula de uma tabela. As células de uma tabela
devem sempre
aparecer entre as marcações de linhas (<tr> e </tr>).
<TH></TH>
Desta forma são definidos os títulos de uma tabela. Estes podem ser posicionados
em qualquer
célula. A diferença entre a marcação de célula e título de célula é que o título
aparece em negrito.
<ROWSPAN> Atributo
para <TD> e <TH>
Utilizado para especificar o número de linhas
ocupadas pela célula.
<COLSPAN> Atributo para
<TD> e <TH>
Utilizado para especificar o número de colunas
ocupadas pela célula.
<WIDTH>
Atributo de <TD> e <TH>
Largura da célula.
Exemplos:
<table border>
<tr>
<td>Produtos/Mês</td>
<th>Janeiro</th><th>Fevereiro</th><th>Março</th>
</tr>
<tr>
<th>Café</th><td>100</td><td>200</td><td>300</td>
</tr>
<tr>
<th>Milho</th><td>85</td><td>90</td><td>150</td>
</tr>
</table>
Vai aparecer dessa
forma:
| Produtos/Mês | Janeiro | Fevereiro | Março |
|---|---|---|---|
| Café | 100 | 200 | 300 |
| Milho | 85 | 90 | 150 |
<table
border=5>
<tr>
<td>Cade</td>
<td>Achei!</td> <td>Yahoo</td>
</tr>
<tr>
<td>AltaVista</td>
<td>OpenText</td> <td>Infoseek</td>
</tr>
</table>
Vai aparecer dessa
forma:
| Cade | Achei! | Yahoo |
| AltaVista | OpenText | Infoseek |
|
Frames |
Os frames são as divisões que se
encontra na tela do Netscape. Os browser que permitem essa divisão
são o
Netscape e o Internet Explorer.
Você usará a tag
<frameset> </frameset> para dividir a tela em
frames.
Dentro de <frameset> você terá as opções Cols e
Rows, que vamos ver no exemplo abaixo.
Para dividir a
tela em colunas verticais:
Exemplo:
Primeiramente
devemos fazer um documento HTML para ele ser especificado pela sintaxe de
frames, no
caso chamado você pode dar o nome de index.htm.
<html>
<head>
<title></title>
</head>
<frameset cols="20%,
60%">
<frame src="frame1.htm">
<frame src="frame2.htm">
</frameset>
</html>
Cols: Significa colunas verticais. Nela
você poderá especificar a largura delas em porcentagem. No
exemplo acima, a
tela vai ficar dividida em colunas verticais, em uma parte de 20% e outra de 60%
da tela. A
parte de 20%, abrirá o documento frame1.htm , nome do documento
HMTL, e a de 60%, abrirá o frame2.htm.
Você também poderá
colocar em colunas horizontais:
<html>
<head>
<title></title>
</head>
<frameset
rows="20%,10%,70%">
<frame src="frame1.html">
<frame
src="frame2.html">
<frame src="frame3.html">
</frameset>
</html>
Rows: Significa colunas verticais. No exemplo
acima, a tela vai ser dividida em três partes.
Para intercalar
janelas verticais e horizontais, será necessário definir várias áreas
"frameset". Para cada
área delimitida como "frameset" você poderá definir
número de linhas ou colunas. Veremos como fazê-la,
nos exemplo abaixo.
Para obter uma tela com esta aparência:
________________________________________
|
|
|
|
|
|
|
|
|____________|_____________|______________|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|____________________|___________________|
O frame
document deverá ser escrito desta forma:
<html>
<head>
<title>Título da HP</title>
</head>
<frameset rows="30%, 70%">
<frameset
cols="33%, 33%, 33%">
<frame src="teste1.html">
<frame
src="teste2.html">
<frame src="teste3.html">
</frameset>
<frameset cols="50%, 50%">
<frame src="teste4.html">
<frame src="teste5.html">
</frameset>
</frameset>
</html>
Na tag <frame> tem
as seguintes opções:
SRC: Será o documento
HTML que o frame vai chamar.
Ex:
<FRAME
SRC="teste1.htm">
SCROLLING: Define se o Frame terá
barra de rolagem ou não.
Ex:
< FRAME
SRC="teste1.htm" SCROLLING="no" >
< FRAME SRC="teste1.htm"
SCROLLING="yes" >
< FRAME SRC="teste1.htm" SCROLLING="auto" >
Yes: Exibe a barra de rolagem.
No:
Não exibe a barra de rolagem.
Auto: Exibe a barra de
rolagem só se for necessário.
NORESIZE: Não deixa o
usuário mudar o tamanho do frame.
Ex:
< FRAME
SRC="teste1.htm" NORESIZE>
BORDER: Especifica a
borda do frame.
Ex:
< FRAME SRC="teste1.htm"
FRAMEBORDER="Yes" BORDER=5 COLORBORDER=BLUE>
FRAMEBORDER: Poderá ter ou não borda.
Ex:
FRAMEBORDER="Yes"
FRAMEBORDER="no"
BORDER: Determinará o tamanho da borda.
Ex:
BORDER=5
BORDER=3
COLORBORDER:
Determinará a cor da borda.
Ex:
COLORBORDER=BLUE
COLORBORDER=YELLOW
COLORBORDER=RED