0.8 HTML-09 - Frames

Centro de Form.
Profissional de
Alverca
9-06-2011
HTML
Sesso 9
HTML
Criao de Pginas WEB

Frames
Quem j navegou um pouco pela Internet com certeza j

encontrou pginas em que, por exemplo, existe um menu
esttico no lado esquerdo do ecr e o contedo do lado direito
que vai mudando.
Para tal utilizado um processo mais complexo no qual
visualizamos ao mesmo tempo no ecr mais que uma pgina
HTML. Para isso usa-se aquilo que iremos chamar de sistema
de frames.
Formador: Cosmin Constantinescu
Centro de Form. Profissional de

Alverca
9-06-2011
Criao de Pginas WEB

Frames
O princpio simples. Temos uma pgina que nos indica a

posio na qual as outras pginas sero colocadas. No exemplo
referido de um menu do lado esquerdo, ateramos, por exemplo
uma pgina principal.htm que nos diz para exibir a pgina
menu.html no lado esquerdo e a pgina conteudo.htm no lado
direito.
Vamos agora ver como criar uma pgina com trs frames,
uma do lado esquerdo, e do lado direito um cabealho e o
corpo, como no seguinte esquema:
Criao de Pginas WEB

Frames
Para definir frames, utiliza-se o tag <FRAMESET>.

Alverca
9-06-2011
Criao de Pginas WEB

Frames
<HTML>
<HEAD>
<TITLE>Pgina com Frames 26</TITLE>
1) Abrir o ficheiro modelo2.txt com o bloco

de notas e digitar o seguinte cdigo HTML:
</HEAD>
<FRAMESET COLS ="160,*" BORDER="0" FRAMESPACING="0">
<FRAME SRC="esquerda.htm" NAME="esquerda" NORSIZE FRAMEBORDER="NO">
<FRAMESET ROWS ="90,*">
<FRAME SRC="cima.htm" NAME="cima" NORESIZE SCROLLING="NO"
FRAMEBORDER="NO">
<FRAME SRC="conteudo.htm" NAME="conteudo" FRAMEBORDER="NO">
</FRAMESET>
</FRAMESET>
<NOFRAMES>
<BODY BGCOLOR="#FFFFFF">
Esta pgina usa frames, mas o seu browser no as consegue visualizar.
</BODY>
</NOFRAMES>
</HTML>
Guardar o ficheiro com o nome exemp26.html e testar no IE
Criao de Pginas WEB

Frames

Alverca
9-06-2011
Criao de Pginas WEB

Frames
<HTML>
<HEAD>
<TITLE>Pgina com Frames</TITLE>
</HEAD>
<BODY BGCOLOR="FFD2A6">
</BODY>
</HTML>
Guardar o ficheiro com o nome conteudo.html e testar no IE
Criao de Pginas WEB

Frames
<HTML>
<HEAD>
</HEAD>
<BODY BGCOLOR="B05800">
</BODY>
</HTML>
Guardar o ficheiro com o nome cima.html e testar no IE

Alverca
9-06-2011
Criao de Pginas WEB

Frames
<HTML>
<HEAD>
</HEAD>
<BODY BGCOLOR="0080FF">
</BODY>
</HTML>
Guardar o ficheiro com o nome esquerda.html e testar no IE
Criao de Pginas WEB

Frames
Frames Atributos avanados
Lista de atributos das tags frameset e frame com as quais podemos configurar a
aparncia e caractersticas das janelas.
A parte da criao das janelas propriamente dita, existem muitos atributos com os quais
podemos configurar sua aparncia. Para isso, tanto a Tag <frameset> como <frame>
admitem diversos atributos que permitem especificar a forma de elementos como as
bordas dos frames, a margem, a existncia ou no de barras de deslocamento, etc.
Atributos para a Tag <frameset>
J conhecemos o atributo cols e rows, que servem para indicar se a distribuio em
janelas se far horizontalmente ou verticalmente. Somente se pode utilizar um deles e se
for igual s dimenses de cada uma das divises, separadas por vrgulas.
border="nmero de pixels"
Permite especificar de maneira global para todo o frameset o nmero de pixeis que h de
ter a borda dos frames.

Alverca
9-06-2011
Criao de Pginas WEB

Frames
bordercolor="#rrggbb"
Com este atributo podemos modificar a cor da borda dos frames, tambm de
maneira global todo o frameset.
frameborder="yes|no|0"
Serve para mostrar ou no a borda do frame. Os seus possveis valores so
"yes" (para que se vejam as bordas) e "no" ou "0" (para que no se vejam). Na
prtica elimina a borda, mas permanece uma linha de separao dos frames.
framespacing="nmero de pixels"
Para determinar a largura da linha de separao dos frames. Pode-se utilizar no
Internet Explorer e junto com o atributo frameborder="0" serve para eliminar a
borda das janelas.
Criao de Pginas WEB

Frames
Atributos para a etiqueta <frame>
Para esta Tag, assinalamos o atributo src, que servem para indicar o arquivo que contm
a janela e name, para dar um nome janela e logo direccionar os links para ele.
marginwidth="nmero de pixels"
Define o nmero de pixeis que tem a margem do frame. Esta margem aplica-se pgina
que pretendemos ver nessa janela, de modo que se colocamos 0, os contedos da
pgina nessa janela estaro completamente unidos borda da margem e se indicamos
um valor de 10, os contedos da pgina estariam separados da borda 10 pixeis.
marginheight="nmero de pixels"
O mesmo que o atributo anterior, mas para a margem vertical.
scrolling="yes|no|auto"
Serve para indicar se queremos que hajam barras de deslocamento nas diferentes
janelas. Se indicamos "yes" existem sempre as barras, se indicamos "no" no so
visualizadas e se colocamos "auto" so visualizadas somente se forem necessrias. Auto
o valor por padro.

Alverca
9-06-2011
Criao de Pginas WEB

Frames
noresize
Este atributo no tem valores, simplesmente coloca-se ou no se coloca. No caso de que
esteja presente indica que o frame no pode ser redimensionada. Como podemos ver, ao
colocar o mouse sobre a borda das janelas sai um cursor que nos assinala que podemos
mover e redimensionar assim os frames. Por padro, se no colocamos nada, as janelas
podem ser redimensionadas.
frameborder="yes|no|0"
Este atributo permite controlar a apario das bordas dos frames. Com este atributo
igualado a "0" ou "no" no so visveis bordas.
bordercolor="#rrggbb"
Permite especificar a cor da borda da janela.
Criao de Pginas WEB

Frames
Definir o Nome de cada Frame:

<FRAME SRC=URL original" NAME=nome_da_janela>
Como enviar Novas pginas a Frames Nomeados:

<A HREF=novo_URL" TARGET=nome_da_janela> textp </A>

Alverca
9-06-2011
Criao de Pginas WEB

Frames
<HTML>
<HEAD>
<TITLE>Pgina Principal Frames 27</TITLE>

</HEAD>
<FRAMESET ROWS="10%,90%" >
<FRAME SRC="Topo24.html" NORESIZE>
<FRAMESET Cols="30%,70%">
<FRAME SRC="toc24.html" NAME="janela_toc" MARGINWIDTH="3" MARGINHEIGHT="3">
<FRAME SRC="indice24.html" NAME="janela_principal" FRAMEBORDER="NO">
</FRAMESET>
</FRAMESET>
<NOFRAMES>
<BODY BGCOLOR="#FFFFFF">
Esta pgina usa frames, mas o seu browser no as consegue visualizar.
</BODY>
</NOFRAMES>
</HTML>
Guardar o ficheiro com o nome exemplo27.html e testar no IE
Criao de Pginas WEB

Frames
<HTML>
<HEAD>
<TITLE>Indice 27</TITLE>
</HEAD>
<BODY >
<h3 align="center"> Pgina Principal <h3>
</BODY>
</HTML>
Guardar o ficheiro com o nome indice27.html e testar no IE

Alverca
9-06-2011
Criao de Pginas WEB

Frames
<HTML>
<HEAD>
<TITLE>Contedo 27</TITLE>
</HEAD>

<BODY >
<h3> Meus Exemplos <h3>
<ul>
<li><a href="indice24.html" target="janela_principal"> Pag. Principal </a>
<ul>
<li><a href="exemplo01.html" target="janela_principal">
Exemplos 1 </a>
Exemplos 2 </a>
Exemplos 3 </a>
<li>
Exemplos 19 </a>
</ul>
</ul>
</BODY>
</HTML>
Guardar o ficheiro com o nome toc24.html e testar no IE
Criao de Pginas WEB

Frames
<HTML>
<HEAD>
<TITLE>topo 27</TITLE>
</HEAD>
<BODY >
<h3 align="center"> Topo <h3>
</BODY>
</HTML></HTML>
Guardar o ficheiro com o nome topo27.html e testar no IE

Alverca
9-06-2011
Criao de Pginas WEB

Frames
HTML
Sesso 9
HTML
10

0.8 HTML-09 - Frames

Caricato da

Informazioni sul documento

Copyright

Formati disponibili

Condividi questo documento

Condividi o incorpora il documento

Opzioni di condivisione

Hai trovato utile questo documento?

Questo contenuto è inappropriato?

Copyright:

Formati disponibili

0.8 HTML-09 - Frames

Caricato da

Copyright:

Formati disponibili

Centro de Form.

Criao de Pginas WEB

Quem j navegou um pouco pela Internet com certeza j

Formador: Cosmin Constantinescu

Centro de Form. Profissional de

Criao de Pginas WEB

O princpio simples. Temos uma pgina que nos indica a

Criao de Pginas WEB

Para definir frames, utiliza-se o tag <FRAMESET>.

Formador: Cosmin Constantinescu

Centro de Form. Profissional de

Criao de Pginas WEB

1) Abrir o ficheiro modelo2.txt com o bloco

Guardar o ficheiro com o nome exemp26.html e testar no IE

Criao de Pginas WEB

Formador: Cosmin Constantinescu

Centro de Form. Profissional de

Criao de Pginas WEB

Guardar o ficheiro com o nome conteudo.html e testar no IE

Criao de Pginas WEB

Guardar o ficheiro com o nome cima.html e testar no IE

Formador: Cosmin Constantinescu

Centro de Form. Profissional de

Criao de Pginas WEB

Guardar o ficheiro com o nome esquerda.html e testar no IE

Criao de Pginas WEB

Formador: Cosmin Constantinescu

Centro de Form. Profissional de

Criao de Pginas WEB

Criao de Pginas WEB

Formador: Cosmin Constantinescu

Centro de Form. Profissional de

Criao de Pginas WEB

Criao de Pginas WEB

Definir o Nome de cada Frame:

Como enviar Novas pginas a Frames Nomeados:

Formador: Cosmin Constantinescu

Centro de Form. Profissional de

Criao de Pginas WEB

<TITLE>Pgina Principal Frames 27</TITLE>

Guardar o ficheiro com o nome exemplo27.html e testar no IE

Criao de Pginas WEB

Guardar o ficheiro com o nome indice27.html e testar no IE

Formador: Cosmin Constantinescu

Centro de Form. Profissional de

Criao de Pginas WEB

1) Abrir o ficheiro modelo2.txt com o bloco

Guardar o ficheiro com o nome toc24.html e testar no IE

Criao de Pginas WEB

Guardar o ficheiro com o nome topo27.html e testar no IE

Formador: Cosmin Constantinescu

Centro de Form. Profissional de

Criao de Pginas WEB

Formador: Cosmin Constantinescu

Potrebbero piacerti anche