[ H T M L i n f o v2.0 ] - online agytáp webmestereknek és műkedvelőknek

OFFLINE

HTMLinfo => Alapfokú weblecke => A hiperhivatkozás

A linkek fortélyai

Nézzük meg, hogyan készíthetünk linket. Ez sem bonyolultabb, mint az eddigiek: Legyen a link, vagy más néven hiperhivatkozás célja, mondjuk az ismert kereső és portál; a Yahoo.


<BODY>

Látogassunk a <A>Yahoo</A>-ra

</BODY>

Ezzel kijelöltük a "Yahoo" szöveget az <A> elem használatával, már majdnem link. Nincs más hátra, mint megmondani a böngészőnek, hogy mit jelenítsen meg, ha a linkre kattintunk:


<BODY>

Látogassunk a <A HREF="http://www.yahoo.com">Yahoo</A>-ra

</BODY>

Mint láthatjuk, a HREF= után idézőjelek között azt a webcímet kell beírni, amit a böngésző címsorába is írnánk.
Képet is felhasználhatunk linknek.

Ebben az esetben a kód így módosul:

<A HREF="http://www.w3.org" TARGET="_blank"> <IMG SRC="images/w3c_home.gif" width="72" height="48" border="0" alt="W3C"></A></P>

Itt észrevétlenül megismerkedtünk egy másik érdekességgel: a TARGET -tel. Részleteiben a FRAME fejezetben foglalkozunk vele, most csak annyit, hogy a fenti megoldással tudjuk rávenni a böngészőt arra, hogy a link (hivatkozás) célját új ablakban nyissa meg.

Nem csak másik weblap címe írható be az <A></A> elemek közé:


<BODY>

Küldj nekem egy <A HREF="mailto:htmlinfo@fw.hu">e-mail</A>-t!

</BODY>

Ha ezt a lehetőséget alkalmazzuk, a linkre kattintáskor az alapértelmezett levelezőprogram fog elindulni, a címzett helyére előre beírva a linkben hivatkozott cím. Van még egy apróság, amivel megkönnyíthetjük a nekünk levelet küldeni szándékozó dolgát:


<BODY>

Írd meg <A HREF="mailto:htmlinfo@fw.hu?subject=vélemény">véleményedet!</A>

</BODY>

Ha linkünket ebben a formában készítjük el, a levél subject/téma mezője is előre ki lesz töltve.

Kérdés:

Láthatjuk néha veblapokon (ezen is), hogy a link nincs aláhúzva, csak az egérmutató változik meg fölötte. Ezt hogyan érhetjük el?

Válasz:

A HTML dokumentum <HEAD> szekciójába írjuk be a következot:


<style type="text/css">

<!--

a:link, a:visited, a:active {text-decoration: none}-->

</style>

Ezzel azt mondjuk a böngészőnek, hogy minden <A> elemre vonatkozóan hagyja el az aláhúzást. Késobb részletesebben is ismertetjük a css -t (Cascading Style Sheet)

előző tetejére következő