um exemplo mais elaborado

Passemos a um exemplo prático. Crie na raiz (C:\) uma pasta e dê-lhe o nome de Web. Abra o bloco de notas e digite o seguinte código nele:

<html>
<head>
<title>Primeira página</title>
</head>
<BODY text="#FF6600" link="#0000FF" bgcolor="#FFFFCC" alink="#33FF33" vlink="#FFFF66">

Para chamar a segunda página clique <a href = "C:/Web/segunda.htm"> aqui</a>.

</body>
</html>

Salve esse arquivo na pasta Web com o nome de primeira.htm e feche o bloco de notas. Abra novamente o bloco de notas e digite o seguinte código:

<html>
<head>
<title>Segunda página</title>
</head>
<BODY text="#0000FF" link="#00FFFF" bgcolor="#FFFFFF" alink="#FF6600" vlink="#FFFF66">

Para voltar à primeira página clique <a href = "C:/Web/Primeira.htm"> aqui</a>.

</body>
</html>

Salve esse arquivo na pasta Web com o nome de segunda.htm e feche o bloco de notas. Vá até a pasta Web e abra a página Primeira.htm. Perceba o jogo de cores que usamos para montar essa página, apenas inserindo os comandos respectivos na tag <body>. Também há um link (aquele comando que nos remete a outra página, ou a outro ponto da mesma página) quando clicado). Observando as alterações de cores, dê um clique no link. Muito bem, você abriu a segunda página. Observe as cores e dê um clique no link. Parabéns, você já sabe mudar de uma página para outra.

Quando você envia uma página para o local onde o site ficará hospedado, o caminho das páginas se iniciam na pasta onde ficará guardada a página inicial do seu site. Vamos supor que essa página se chama Web. Então vamos acertar o caminho dos links:

<html>
<head>
<title>Primeira página</title>
</head>
<BODY text="#FF6600" link="#0000FF" bgcolor="#FFFFCC" alink="#33FF33" vlink="#FFFF66">
Para chamar a segunda página clique <a href = "segunda.htm"> aqui</a>.

</body>
</html>

e para o outro documento HTML:

<html>
<head>
<title>Segunda página</title>
</head>
<BODY text="#0000FF" link="#00FFFF" bgcolor="#FFFFFF" alink="#FF6600" vlink="#FFFF66">

Para voltar à primeira página clique <a href = "Primeira.htm"> aqui</a>.

</body>
</html>

Salve essas alterações e teste as páginas. Deverão funcionar normalmente!

anterior

índice

próxima