Jak vytvářet www stránky - 3. díl
V minulém díle jsme si vysvětlili, jak definovat titulek stránky a jak zobrazit jednoduchý text v okně prohlížeče. Dnes se podíváme na to, jak určit základní (globální) vlastnosti stránky.
Definování vlastností stránky
Tag BODY, jak jsme si již řekli, slouží k vymezení oblasti, která bude zobrazena v okně prohlížeče (uvnitř tohoto tagu tedy najdete všechen text, obrázky, formátování atp.). Kromě toho můžete pomocí parametrů definovat vlastnosti stránky, jako například barvu pozadí, písma, odkazů nebo obrázek na pozadí. Parametry se vždy uvádějí uvnitř uvozovacího tagu. Obecně platí následující konvence: <TAG parametr1="hodnota" parametr2="hodnota">obsah</TAG>.
Obrázek na pozadí
Obrázek na pozadí stránky může být ve formátu GIF nebo JPG. Definujeme jej parametrem background v tagu BODY, kde hodnota parametru background je adresa, na níž je příslušný obrázek uložen. Cesta může být relativní nebo absolutní.
- relativní určení cesty
- je jednoznačně vhodnější způsob, protože pokud přemístíte své stránky na jiný server, nebudete muset přepisovat cesty v každém dokumentu. Máte-li například obrázek pozadi.jpg v podadresáři IMAGES, určíte cestu background="IMAGES/pozadi.jpg". Je-li obrázek umístěn ve stejném adresáři jako stránka stačí uvést pouze jeho jméno (background="pozadi.jpg").
- absolutní určení cesty
- se používá spíše výjimečně. Můžete například určit, že chcete použít obrázek, který máte umístěný na jiném serveru. V tomto případě nesmíte zapomenout na určení protokolu (používá se http). Obrázek na pozadí můžete definovat například následovně: background="http://www.mujweb.cz/www/mojeobrazky/pozadi.gif".
Barva pozadí
Jestliže nechcete použít na pozadí obrázek, můžete nastavit barvu, kterou bude vyplněno pozadí stránky. V každém případě je vhodné na barvu pozadí nezapomínat. Pokud totiž tento parametr vynecháte, zobrazí se návštěvníkovi pozadí stránky podle jeho nastavení prohlížeče nebo operačního systému, což nemusí být vždy optimální.
Nezapomeňte, že definice obrázku na pozadí má vyšší prioritu, než definice barvy pozadí, takže návštěvník uvidí obrázek, nikoliv barvu pozadí (výjimkou je pouze transparentní GIF, o němž si povíme později). Barva pozadí se uplatní také tehdy, má-li návštěvník vypnuté zobrazování grafiky.
Barvy lze v HTML definovat dvěma způsoby:
- Názvem
. Podporováno je následujících šestnáct barev:
- BLACK - černá
- SILVER - stříbrná
- GRAY - tmavě šedá
- WHITE - bílá
- MAROON - kaštanová
- RED - červená
- PURPLE - tmavě fialová
- FUCHSIA - fuchsiová
- GREEN - zelená
- LIME - žlutozelená
- OLIVE - olivová
- YELLOW - žlutá
- NAVY - námořnická modrá
- BLUE - modrá
- TEAL - šedozelená
- AQUA - tyrkysová
- Hexadecimálně. Tímto způsobem můžete definovat až 16'581'375 barev. Barvy se určují poměrem RGB (tedy červená - zelená - modrá) v hexadecimálním tvaru (00, 01, 02, ..., FD, FE, FF), přičemž pro každou barvu jsou určeny dvě číslice. Černá například vznikne, "smícháte-li" červenou, zelenou a modrou v nejvyšší "hustotě" - tedy FFFFFF. Bílá naopak znamená, že žádná barva není použita, takže jí vyjádříme jako 000000. Čistá červená vznikne tak, že použijeme z palety RGB pouze červenou barvu (tedy R) - FF0000. Určujeme-li barvy hexadecimálně, uvozujeme je znakem křížek ,.
Barvu pozadí tedy můžete definovat parametrem bgcolor="red" stejně jako bgcolor="#FF0000".
Barva textu
Není-li určeno jinak, zobrazí se text barvou, kterou nadefinujete v tagu BODY. K tomu slouží parametr text, který určuje barvu textu stejným způsobem, jako parametr bgcolor určuje barvu pozadí stránky.
Chcete-li tedy například použít černé písmo, napíšete text="black" nebo text=",FFFFFF".
Barva odkazů
Odkazy na stránce mohou mít nadefinovány tři různé barvy:
- Barva odkazu, na který uživatel ještě nekliknul - parametr link.
- Barva odkazu, v okamžiku, kdy na něj uživatel klikne myší - parametr alink.
- Odkaz, na který již uživatel kliknul (tedy navštívil odkazovanou stránku) - parametr vlink.
Zejména určení první a třetí barvy je velmi důležité, protože usnadňuje návštěvníkovi orientaci na stránce - snadno tak může poznat, kterou stránku na vašem webu již navštívil a kterou ještě ne. Jednotlivé barvy se určují zcela shodně, jako v předcházejících případech.
Jestliže tedy chcete, aby nenavštívené odkazy byly modré, po ukázání myší zezelenaly a po navštívení byly fialové, použijete syntaxi link="blue" alink="green" vlink="fuchsia" nebo link",0000FF" alink="00FF00" vlink="FF00FF".
Shrnutí
Na závěr si uděláme modelový příklad. Chceme stránku, která má následující parametry:
- bílou barvu pozadí
- obrázek pozadi.gif, který je umístěn v podadresáři IMAGES
- černé písmo
- nenavštívené odkazy modrou barvou, přičemž tyto odkazy při kliknutí zezelenají
- navštívené odkazy červenou barvou
Kód takové stránky by tedy mohl vypadat následovně:
<HTML>
<HEAD>
<TITLE>Zkušební stránka</TITLE>
</HEAD>
<BODY bgcolor="#00000" background="IMAGES/pozadi.gif" text=",FFFFFF" link=",0000FF" alink=",00FF00" vlink=",FF0000">
.
.
.
obsah stránky
.
.
.
</BODY>
</HTML>
Do příští lekce si vyzkoušejte vytvořit vlastní variace barev textu, odkazů a pozadí stránky.
|
