Nevoeiro Z Pages - HTML 3

D) LINKS

1) Links Externos

Um link externo é uma parte da homepage que quando clicada conduz o navegador a uma outra página na internet. Para isso utilize a tag <A HREF> e a url (endereço de internet) da página para a qual você quer que o navegador vá. Veja sua sintaxe:
<A HREF="url"> texto do link </A>
Veja um exemplo de uma página com link externo:
<HTML>
<HEAD>
<TITLE>Exemplo de Link Externo</TITLE>
</HEAD>
<BODY BGCOLOR="white">
<CENTER>
<H2> Links Preferidos </H2>
<BR><BR>
<A HREF="http://www.yahoo.com.br"> Yahoo! Brasil </A>
<BR><BR>
<A HREF="http://www.cade.com.br"> Cade </A>
</CENTER>
</BODY>
</HTML>
Veja o resultado da página:

2) Usando um imagem para acionar um link
Para usar uma imagem como um link (imagem clicável) é só usar a tag <A HREF> normalmente, mas no lugar relativo ao "texto do link" deve-se colocar a tag de imagem <IMG SRC="arquivo.gif">. Veja um exemplo:
<HTML>
<HEAD>
<TITLE>Imagens Clicáveis</TITLE>
</HEAD>
<BODY BGCOLOR="white">
<CENTER>
<H2> Links Preferidos </H2>
<BR><BR>
<A HREF="http://www.yahoo.com.br"><IMG SRC="imagem1.gif"></A>
<BR><BR>
<A HREF="http://www.cade.com.br"><IMG SRC="imagem2.gif"></A>
</CENTER>
</BODY>
</HTML>
Veja o resultado:

3) Criando um link para e-mail
Em html, a sintaxe de um endereço é muito parecido com um link normal. Para criar um link para e-mail utilize a tag de links <A HREF> e no lugar da url digite " mailto:'endereço' ". Veja um exemplo:
<HTML>
<HEAD>
<TITLE>Link para e-mail</TITLE>
</HEAD>
<BODY BGCOLOR="white">
<CENTER>
<H2> Meu E-mail </H2>
<BR><BR>
<A HREF="mailto:nevoeiroz@hotmail.com">O e-mail de nevoeiro z, eu: nevoeiroz@hotmail.com</A>
</CENTER>
</BODY>
</HTML>

4) Links Internos
Um link interno serve para levar o visitante da página para posições diferentes dentro do mesmo documento. Isso é bastante útil quando se quer fazer uma página grande com vários tópicos ou quando se quer criar um glossário, por exemplo.
Para que o link interno saiba para onde ir, é necessário um alvo. Um alvo é definido com a tag:
<A NAME="Nome do alvo"> alvo </A>
Entre a tag <A NAME> e a tag </A> deve entrar todo o conteúdo da parte da página à qual ela se refere, não importa o tamanho. O nome do alvo pode ser qualquer coisa, até mesmo de uma figura.
Com o alvo definido, só basta criar os links. Um link interno diferencia-se dos externos por um pequeno detalhe: o sinal "#". Este sinal indica para o navegador que aquela parte da url é um subconjunto da página atual. A sintaxe da tag de link interno é:
<A HREF="#alvo">Clique aqui para o alvo</A>
O texto em "#alvo" deve ser idêntico ao texto em "Nome do alvo" da tag <A NAME>.
Veja um exemplo de página com links internos:
<HTML>
<HEAD>
<TITLE>Links Internos</TITLE>
</HEAD>
<BODY BGCOLOR="A9C5C9">
<CENTER>
<H2><FONT COLOR="blue"> Links Internos </FONT></H2>
<HR WIDTH=80% ALIGN=CENTER SIZE=6>
<BR>
<A HREF="#Espertos">Espertos Surdos Não-Mudos</A>
<BR>
<A HREF="#Passaporte">Passaporte</A>
<BR>
<A HREF="#Direção">Uma Única Direção: Em Círculos</A>
<BR>
<A HREF="#Sentido">Sentido</A>
<BR>
<HR WIDTH=50% ALIGN=CENTER SIZE=6>
<BR><BR>
<H3><B><A NAME="Espertos">Espertos Surdos Não-Mudos</A></B></H3>
A avareza, o avaro<BR>
Uma reunião em volta do padre<BR>
A nós falam sem ouvir<BR>
O que eles próprios dizem.
<HR WIDTH=45% ALIGN=CENTER SIZE=2>
<H3><B><A NAME="Passaporte">Passaporte</A></B></H3>
Nuvens, um mundo novo<BR>
Figuras bizarras, estranhas<BR>
Calmas<BR>
Um hidrante, um cavalo<BR>
Um palácio, um dragão<BR>
Uma nova dimensão<BR>
Em que viajo<BR>
Sem nunca sair do chão
<HR WIDTH=45% ALIGN=CENTER SIZE=2>
<H3><B><A NAME="Direção">Uma Única Direção: Em Círculos</A></B></H3>
Girando, girando, girando<BR>
Um bobo cego que só vê uma coisa<BR>
Girando em torno de seu próprio umbigo.
<HR WIDTH=45% ALIGN=CENTER SIZE=2>
<H3><B><A NAME="Sentido">Sentido</A></B></H3>
A vida não tem sentido<BR>
sem uma meta a alcançar.<BR>
A vida não tem sentido<BR>
sem um desafio a enfrentar.<BR>
A vida não tem sentido<BR>
sem alguém a quem procurar.<BR>
A vida não tem sentido<BR>
sem alguém para amar.<BR>
<HR WIDTH=45% ALIGN=CENTER SIZE=2>
</CENTER>
</BODY>
</HTML>
Veja como a página deve ficar:

5) Modificando a cor dos links
A cor padrão dos links é azul, mas você pode alterá-la colocando o modificador LINK="rrggbb" dentro da tag <BODY>.

6) Modificando a cor do link já visitado
O padrão usado pelo navegador é roxo. Para alterá-lo é só colocar o elemento VLINK="rrggbb" dentro da tag <BODY>

7) Modificando a cor do link ativado
Para alterar a cor do link ativado é só colocar o modificador ALINK="rrggbb" dentro da tag <BODY>
Veja um exemplo com todas as modificações:
<HTML>
<HEAD>
<TITLE>Cores dos Links</TITLE>
</HEAD>
<BODY BGCOLOR="black" TEXT="FFA244" LINK="80FFFF" VLINK="42FF72" ALINK="yellow">
<CENTER>
<H2> Cores dos Links </H2>
<H3> Meus Favoritos </H3>
<A HREF="http://login.yahoo.com/config/mail?.intl=br">Yahoo! Mail</A><BR><BR>
<A HREF="http://miner.bol.com.br">BOL - Metaminer<BR>(O site de busca que procura em todos os outros sites de busca)</A><BR><BR>
<A HREF="www.bussolaescolar.com.br">Bússola Escolar - Enciclopédias e Dicionários</A><BR><BR>
<A HREF="www.cade.com.br">Cade?</A><BR><BR>
<A HREF="www.hotmail.com">Hotmail (BR)</A><BR><BR>
<A HREF="www.amigosvirtuais.com.br">UOL - Amigos Virtuais</A><BR><BR>
<A HREF="www.zh.com.br">Zero Hora Digital - O Jornal do Rio Grande do Sul</A>
</CENTER>
</BODY>
</HTML>
Veja o resultado final:

HTML

HTML (1)

HTML (2)

HTML (3)

HTML (4)

HTML (5)

HTML (6)

Copyright ® 2000. RodCom. Todos os direitos reservados.
Página feita por Rodison dos Santos Ferreira.
nevoeiroz@hotmail.com
http://www.oocities.org/br/html_nevoeiroz
(html://www.oocities.org/br/html_nevoeiroz)
Florianópolis - SC - Brasil.

Em caso de qualquer dúvida mande-me um e-mail:

Voltar para o início