22. října 2011 12:43

6. díl - Odkazy

Už umíte formátovat text pomocí HTML a proto je na čase postoupit na další úroveň. Dnes se podíváme na jednu z nejdůležitějších věcí HTML - na hypertextové odkazy. Zpravidla jsou podtržené nebo barevné a při kliku na ně se přesunete na jinou stránku.

Odkaz <a>

Odkaz je párová řádková značka. Adresu stránky, na kterou odkaz má odkazovat, se zadává pomocí vlastnosti href. Zápis odkazu vypadá takto:

<p>Odkaz je <a href="http://www.vicko.cz/">zde</a></p>

Slovo zde by se vám mělo v prohlížeči podtrhnout a zbarvit do modra. Když na něj kliknete, dostanete se na můj web.

Adresa

Abyste mohli psát odkazy, musíte vědět, co je to adresa. Adresa udává cestu, kudy se dostanete k určitému souboru (v tomto případě potřebuje znát cestu prohlížeč, aby vás přesměroval na správnou stránku). Existují dva druhy adres - absolutní a relativní.

Absolutní adresa

Pomocí absolutní adresy vás prohlížeč přesměruje vždy na stejnou stránku, ať se nacházíte kdekoliv na internetu, protože je v ní přesně zadáno, kde se daná stránka nachází. Absolutní adresa začíná protokolem http:// (případně https:// pro zabezpečené připojení nebo ftp:// pro veřejné FTP). Za protokolem následuje doména stránky (např. www.vicko.cz, www.seznam.cz, www.google.com, ...). V doméně lze ve většně případů vynechat www., ale některé stránky fungují pouze s ním a některé naopak pouze bez něj. Za doménou by mělo následovat lomítko, ale to můžete vynechat, pokud nebude adresa dále pokračovat. Zde máte pár příkladů adres:

http://blogeri.vicko.cz/
http://www.elfanie.cz/
http://chat.vicko.cz/

Všechny tyto adresy odkazují na hlavní stránky webů. Pokud chcete odkazovat na určitou podstránku, musíte zadat ještě cestu k ní. Například cesta ke stránce o mé hře Vesmírná bitva vypadá takto:

http://www.vicko.cz/kestazeni/hry/vesmirna_bitva.php
Název souboru této podstránky je vesmirna_bitva.php. Tento soubor se nachází ve složce hry, která se nachází ve složce kestazeni. Prohlížeč se dostane k souboru tak, že přejde stránku www.vicko.cz, tam otevře složku kestazeni, potom složku hry a v ní soubor vesmirna_bitva.php. Dejte si pozor, aby jste při psaní adresy nezadávali zpětná lomítka \, která používá Windows! V tom případě vám odkaz nebude fungovat.

Relativní adresa

Tato adresa udává cestu mezi složkou, ve které se nachází stránka, a souborem, na který odkazuje odkaz. Adresa nezačíná protokolem, ale přímo názvem složky nebo souboru. Pokud je odkaz na stránce s adresou:

http://adresa_stranky.cz/auta/skoda/index.html
Tak na soubor fabia.html, který se nachází ve složce skoda odkážete takto:
fabia.html
Pokud chcete odkázat na soubor motor.html, který se nachází ve složce soucasti, která se nachází ve složce skoda, odkážete na něj takto:
soucasti/motor.html

Když chcete odkazovat do složky, která je výše, než složka skoda, tak pro přestup o úroveň výšše se používají dvě tečky ... Takže pokud chcete odkazovat do složky ferrari, která je na stejné úrovni, jako složka skoda, na soubor index.html, adresa bude takováto:

../ferrari/index.html

Relativní cestou také můžete pospat cestu od hlavní stránky webu. Toho docílíme tak, že adresu začneme lomítkem. Takže pokud se budete chtít dostat k souboru informace.html ve složce auta, adresa bude vypadat takto:

/auta/informace.html

Adresa směřující na hlavní stránku webu bude jednodušše vypadat takto:

/

Vlastnost target

Tato vlastnost definuje, kam se má odkaz otevřít. Tato vlastnost je určena hlavně pro rámy. Pro vás může být zajímavá pouze jedna hodnota, a to _blank. Odkaz s takto nastavenou hodnotou se otevírá do nového okna, nebo panelu (podle nastavení prohlížeče). Zde je příklad:

<a href="http://www.vicko.cz/" target="_blank">odkaz</a>

Nastavení barev odkazů

Ve značce <body> lze mimo jiné nastavit barvy odkazů. Pomocí vlastnosti link nastavíte barvu nenávštíveným odkazům, vlastností vlink barvu navštívených odkazů a vlastností alink barvu odkazu po označení (kliknutí). Zde je příklad:

<body link="red" vlink="black" alink="purple">

Odkazy směřující na stránku, kde jste ještě nebyli, se zobrazí červeně, odkazy na navštívené stránky černě a označené odkazy fialově.

Barva odkazu po najetí lze bohužel nastavit pouze pomocí CSS nebo JavaScriptu.

Co vás čeká příště

Sedmý díl si vezme na starosti SuperMartas. S ním se podíváte na to, jak se tvoří seznamy. Na další díl se můžete těšit již zítra!

Hodnocení

Celkové hodnocení
11 hlasů
Vaše hodnocení
Vyberte počet hvězdiček

Komentáře

Jméno:
Předmět:
Komentář:
  :):-|:P:D;):(8)[evil][arrow][idea][?][!]
Kontrola:
Žádné komentáře.
© 2011 - 2017 SuperMartas a Tomáš Hypeš