Odkazy

URL - adresa souboru

Nejprve si musíme vysvětlit důležitý pojem - URL. URL, adresa souboru sestává z několika částí. Např. http://javascript.webz/xhtml_odkazy.php3. http:// je protokol, pomocí něj se soubor přenáší. javascript je doména třetí úrovně. Pak následuje jméno domény webz. Potom generické jméno, nebo-li doména nejvyššího řádu cz (jinak třeba sk, com, org, net..). Po prvním lomítku následuje cesta k dokumentu xhtml_odkazy.php3.

URL v takovém tvaru většinou nezadáváte, nejčastěji zapíšete www.zive.cz a prohlížeč sám otevře soubor default.asp. To je dáno nastavením serveru. Obvykle se implicitně otevírají soubory index.htm, index.html nebo právě default.htm, default.html. Proto je dobré předem počítat s tím, že úvodní stánka vašeho webu se jmenuje index.htm(l).

URL může být relativní nebo absolutní. Absolutní URL je například právě http://javascript.webz/xhtml_odkazy.php3. Relativní URL je například xhtml_odkazy.php3 nebo css/clear.php3. První URL můžete použít pro odkaz ze souboru, který je ve stejné složce. Druhou URL použijete v souboru, který se nachází ve složce css - to znamená že připojíme část URL, http://javascript.webz.cz/xhtml_odkazy.php3. Pokud se chceme ve stromu složek posunout zpět třeba z http://javascript.webz.cz/css/clear.php3 do http://javascript.webz.cz/xhtml_odkazy.php3, relativní URL bude vypadat takto: xhtml_odkazy.php3.

Vytvoření odkazu

Odkaz se vytváří elementem a (anglicky anchor - kotva). Jeho atribut href udává URL odkazovaného souboru.

Příklad

<a href="http://www.zive.cz">Živě</a>

Ukázka

Živě

Dalším užitečným atributem je title. Jeho hodnotou může být text, který bude popisovat kam odkaz odkazuje.

Jiným typem odkazů jsou záložky. Takový odkaz vám otevře vybranou stránku na vybraném místě, třeba uprostřed (odroluje na vybrané místo). Záložky se vytvářejí atributem name u tagu a.

Nějaký text <a name="zalozka" /> Pokračování stránky

Záložky není nijak vidět, ale můžeme se na ní přesunout odkazem, tak aby text následující po záložce byl na prvním řádku prohlížeče.

<a href="soubor.html#zalozka">Na záložku</a>

Tento odkaz otevře stránku soubor.html. Všimněte si nové věci v URL #zalozka, tímto způsobem se zadává jméno záložky. S použitím záložek může vzniknou problém pokud se nacházejí u spodního okraje stránky, prohlížeč je v takovém případě nemůže zobrazit na prvním řádku, ale až dále, pouze doroluje dokument až na konec.

Speciálním odkazem je odkaz na e-mail, který umožňuje otevřít e-mailového klienta (MS Outlook).

Příklad

<a href="mailto:ashjfjbkdbah@seznam.cz">Mail</a>

URL tohoto odkazu se skládá ze speciálního protokolu mailto: za kterým následuje e-mailová adresa. Po kliknutí by se mělo otevřít okno Vašeho e-mailového klienta s novou zprávou a vyplněnou položkou adresát. Tento odkaz nefunguje vždy, ne každý má poštovního klienta, proto je dobré napsat do textu odkazu samotný e-mail.

Formátování odkazů

Asi mi dáte za pravdu modro-fialové odkazy se nebudou výjímat na každém webu. Proto existuje možnost změnit styl odkazů pomocí CSS. Styl odkazů lze nastavit pomocí pseudoelementů v externím souboru nebo uvnitř elementu style.

Příklad

a {font-size: 15px}
a:link {color: black}
a:hover {background-color: gray}
a:visited {color: red}
a:active {color: blue}

První řádek nastavuje velikost písma odkazů. Na dalších řádcích se setkáváme s pseudoelementy. a:link nastavuje styl nenavštívených odkazů, a:hover - styl odkazů po najetí myši, a:visited - navštívené odkazy, a:active - aktivní odkazy. Užitečnou vlastností CSS je text-decoration: none, která zakazuje podtrhávání. Odkaz dle našeho stylu by vypadal následovně: Živě.cz

Odkazy, které vypadají jako tlačítka

Odkazy mohou vypadat i jako tlacitka.php">Tlačítka.

Další: Obrázky

Navigace