Frames – Uma página em cada moldura
As páginas que mostraremos em cada moldura são documentos HTML iguais aos que viemos criando anteriormente. Podemos colocar qualquer elemento HTML dos estudados neste manual, como etiquetas de parágrafo, imagens, cores de fundo, etc.
Cada documento, como já indicamos, se escreve separado em seu próprio arquivo HTML. Para o exemplo do capítulo anterior podemos definir os arquivos HTML da seguinte maneira.
pagina1.html
É a página que contém o título da web. Simplesmente se trata de uma etiqueta <H1> de título. A página tem seu próprio título, com a etiqueta <TITLE>, que não poderá ser visualizada nenhum lugar, a não ser que se mostre esta página sem os frames, já que as páginas dentro das janelas herdam o título da definição dos frames.
<html>
<head>
<title>Título Açougue Gonçalves</title>
</head>
<body bgcolor="#DECC09">
<h1 align=center>Açougue Gonçalves</h1>
</body>
</html>
pagina2.html
É a página que se apresentará na área principal da definição de frames, ou seja, a página que tem mais espaço para ser visualizada e onde colocaremos os conteúdos da web. Neste caso, mostra uma mensagem de bem-vindo à web, que fará as vezes de portal.
<html>
<head>
<title>Portal do Açougue Gonçalves</title>
</head>
<body bgcolor="#CF391C" text="#ffffff">
<h1 align="center">Bem-vindo a nossa web</h1>
<br>
<br>
O açougue Gonçalves, com mais de 100 anos de experiência, é a melhor fonte de carnes de boi e de porco da região.
<br>
<br>
Tanto no inverno como no verão você pode encontrar nossas ofertas de temporada de primeira qualidade.
</body>
</html>
pagina3.html
Nesta página se mostrará a barra de navegação pelos conteúdos do site. Contém links que deveriam atualizar o conteúdo da área principal da declaração de frames, para mostrar os distintos conteúdos do sitio, por exemplo, o portal, os produtos, a página de contato, etc.
<html>
<head>
<title>Barra de navegação de açougue Gonçalves</title>
</head>
<body bgcolor="#AC760E" link="ffffcc" vlink="ffffcc">
<div align="center">
<b>
<a href="pagina2.html">Portal</a> |
<a href="produtos.html">Produtos</a> |
<a href="contato.html">Contato</a>
</b>
</div>
</body>
</html>
Podemos
ver como fica a página de frames com estes conteúdos, que simulam a página de um açougue.
