Obsah lekce:
Jazyk HTML
Zdrojový kód dokumentu psaném v jazyce HTML je prostý text psaný v ASCII formátu,
který lze prohlížet i upravovat v libovolném textovém editoru. Jazyk HTML je jazykem
typografickým, což znamená, že výsledný dokument pouze popisuje, ale jeho
interpretace je přenechána až na cílový browser (čti brouzr = prohlížeč
HTML dokumentů - např. Netscape Navigator, Internet Explorer nebo Mosaic).
|
Ukázka zdrojového textu.
|
Syntaxe příkazů
Úprava textu je realizována pomocí příkazů, které jsou uzavřeny do ostrých
závorek "<" a ">". Většina těchto příkazů ohraničujících
určitou část textu má na začátku umístěno počáteční a na konci koncové návěští
příkazu. Koncové návěští se od počátečního liší pouze umístěním lomítka
"/" před název návěští:
|
<H2> Obsah </H2>
|
Příkaz, který je tvořen počátečním a koncovým návěštím, se nazývá
"kontejner". Avšak ne všechny příkazy jsou ukončovány koncovým návěštím.
Jako příklad může sloužit příkaz <BR>, který si v textu vynucuje přechod
na nový řádek.
Většinu příkazů lze upřesnit
pomocí různých atributů. Atributy jsou psány hned za vlastní počáteční návěští
(dovnitř ostré závorky). Hodnoty jsou atributům přiřazovány pomocí rovnítka. Příkladem
může být příkaz <IMG> zobrazující obrázek, jehož umístění je uloženo
v atributu SRC:
|
<IMG SRC="image/fotka.gif">
|
Je běžné, že příkazy HTML lze do sebe vkládat - mezi počáteční a koncové
návěští jednoho příkazu se vloží příkaz jiný. Tímto způsobem je možné
dosáhnout pozoruhodných výsledků v konečném vzhledu dokumentu.
Pokud prohlížeč některé návěští
nezná, jednoduše jej ignoruje. Tedy starší prohlížeč, který nezná některá z
nových rozšíření jazyka HTML neukončí svou činnost chybovým hlášením, ale přejde
neznámé návěští bez povšimnutí.
URL adresa
Hlavním cílem prohlížečů je
zajistit přístup ke zdrojům, které se mohou nacházet na libovolném serveru připojeným
na Internet. Zdrojem je míněn objekt na Internetu a mohou jím být HTML dokumenty,
obrázky, programy a mnoho dalších. K jednoznačné identifikaci těchto objektů slouží
URL (Uniform Resource Locator) adresa.
Tyto URL adresy slouží jednak při
zadávání adres v prohlížečích, pokud si chcete prohlédnout některý konkrétní
dokument nebo do prohlížeče natáhnout nějaký jiný objekt, a jednak přímo v HTML
dokumentech, kde slouží k realizaci hyperlinků a vkládání obrázků.
Části kompletní URL adresy:
- přenosový protokol (např. http:, ftp:, news:, telnet:)
- jméno serveru, port
- přístupová cesta
- jméno souboru
|
http://dione.zcu.cz/~indy/index.html
V tomto případě prohlížeč zobrazí HTML dokument index.html, který je
uložen na serveru dione.zcu.cz v adresáři ~indy.
|
Při zadávání cest je nutno si dát pozor na to, že v jazyce HTML se k oddělení
názvů adresářů používá místo obráceného lomítka ("\") lomítko
normální ("/").
Adresa objektu se nemusí vždy zadávat
jako kompletní URL adresa, ale je možné používat i relativní adresy. Relativní
adresování se obvykle používá v případech, kdy odkazujete na zdroje uložené přímo
na vašem serveru. Základním adresářem je pak adresář, v němž je uložen aktuální
dokument.
|
Příklad.
V rámci dokumentu: http://dione.zcu.cz/~indy/index.html
má být zobrazena grafika:
http://dione.zcu.cz/~indy/Images/pinknet.gif
Potom v návěątí IMG stačí zadat cestu:
<IMG SRC="Images/pinknet.gif">
|
Příkazy každého HTML dokumentu
Některá návěští jsou povinná
a tvoří základní kostru každého HTML dokumentu. Celý dokument musí být uzavřen
mezi návěští <HTML> a </HTML>. Kromě toho musí každý
dokument mít svou hlavičku, která se označuje návěštím <HEAD> a </HEAD>.
V hlavičkové části dokumentu je nutné pomocí návěští <TITLE> a </TITLE>
zadat název dokumentu. Vlastní obsah dokumetu je pak zadáván do oblasti omezené návěštími
<BODY> a </BODY>.
Dále by měl dokument, podle
standardu verze 3.2 jazyka HTML, obsahovat oficiální identifikaci HTML dokumentu, která
je specifikována v prvku komentáře uvozeného znakem "!" - vykřičník (viz.
první řádka zdrojového souboru následujícího příkazu).
|
Příklad (nejjednodušší úplná definice stránky).
<!DOCTYPE HTML PUBLIC "-//IETF/DTD HTML v.m//EN">
<HTML>
<HEAD>
<TITLE> </TITLE>
</HEAD>
<BODY>
</BODY>
</HTML>
|
|
-
- <! [--text_komentáře_1--] [--text_komentáře_2--] ... >
- komentář je text, který přímo s obsahem HTML dokumentu nesouvisí a při zpracování
prohlížečem je ignorován; kromě kometování částí dokumentu může mít i jiný
specifický účel, jako např.:
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML v.m//EN"> - oficiální
identifikace HTML dokumentu
<!--#příkaz parametr=hodnota parametr=hodnota ...
--> - příkaz pro server (serverem vkládané vsuvky - server nahradí tyto příkazy
v těle dokumentu částmi HTML textu):
#echo var="proměnná" - nahradí vsuvku hodnotou
proměnné (LAST_MODIFIED, DOCUMENT_NAME, DOCUMENT_URL, QUERY_STRING_UNESCAPED,
DATE_LOCAL, DATE_GMT, ...)
#exec cgi="program" - nahradí vsuvku výstupem
spuštěného programu nebo scriptu
#exec cmd="příkaz" - nahradí vsuvku výstupem příkazu
standardního interpretu příkazů (shellu)
#size file="soubor" - nahradí vsuvku údajem o
velikosti zadaného souboru
#flastmod file="soubor" - nahradí vsuvku dobou
poslední modifikace zadaného souboru
#include file="soubor" - nahradí vsuvku obsahem
souboru
#include virtual="url" - nahradí vsuvku obecným
URL
- <HTML> ... </HTML>
- párová značka, která slouží k ohraničení každého dokumetu
- <HEAD> ...prvky záhlaví... </HEAD>
- párová značka, která vymezuje záhlaví dokumentu; obsahuje uspořádanou kolekci
informací o dokumentu, která slouží výlučně pro prohlížecí program; do záhlaví
dokumentu náleží prvky: <TITLE>, <BASE>, <ISINDEX>, <META>,
<LINK>, <STYLE>, <SCRIPT>
- <TITLE> ...text titulku... </TITLE>
- párová značka, která definuje titulek dokumentu, každý HTML dokument musí
obsahovat titulek TITLE (měl by obsahovat stručnou a výstižnou charakteristiku;
použije se například v seznamu záložek, zobrazí se na horní liště okna prohlížecího
programu a zachovává jej většina vyhledávacích programů; počet znaků by neměl
překročit 64 znaků
- <BODY background="url" bgcolor=" barva"
text="barva" link=" barva" alink="barva"
vlink=" barva">
- ...tělo dokumentu...
- </BODY>
- párová značka ohraničující celou hlavní část dokumentu
background |
URL obrázku použitého jako podklad |
bgcolor |
barva podkladu dokumentu |
text |
barva normálního textu |
link |
barva hypertextových odkazů |
alink |
barva aktivních (právě vybraných) odkazů |
vlink |
barva již použitých odkazů |
-
|
|