
Specializovaný týdeník o výpočetní technice
o Internetu (CW 17/97)
Vytváříme si domovskou stránku
Seznamy & spol.
Jiří Kosek ml.
V předchozích dílech seriálu jsme se naučili vytvářet jednoduché HTML-dokumenty. Ve složitějších dokumentech můžeme použít i další tagy, které nám umožní vytvářet různé seznamy, předformátované úseky textu a citace.
V HTML můžeme vytvářet tři základní druhy seznamů: nečíslované, číslované a definiční.
Pro vytvoření nečíslovaného seznamu je zapotřebí:
1. napsat tag, který zahájí seznam -- <UL>;
2. napsat patřičný počet položek seznamu; každé položce musí předcházet tag <LI>;
3. ukončit seznam tagem </UL>.
Jednoduchý seznam můžeme zapsat tedy takto:
<UL>
<LI>Jablka
<LI>Hrušky
<LI>Švestky
<LI>Banány
</UL>
V jedné položce seznamu může být i text, který obsahuje více odstavců -- odstavce stačí oddělit tagem <P>.
U číslovaných seznamů je před jednotlivé položky místo značky odrážky umísťováno pořadové číslo položky v seznamu. Definice seznamu je stejná jako u nečíslovaných seznamů, pouze místo tagů <UL> a </UL> je nutné použít <OL> a </OL>. Pro větší názornost si předvedeme malou ukázku:
<OL>
<LI>Jablka
<LI>Hrušky
<LI>Švestky
<LI>Banány
</OL>
Definiční seznam se od předchozích dvou poněkud odlišuje. Jeho uplatnění je v případech, kdy chceme do dokumentu zařadit např. slovníček, který obsahuje termíny a jejich vysvětlení. Postup při vytváření definičního seznamu je následující:
1. začátek seznamu označíme tagem <DL>;
2. před termín, jenž definujeme, napíšeme tag <DT>;
3. mezi termín a jeho definici umístíme tag <DD>;
4. opakujeme bod 2. a 3. pro všechny termíny v seznamu;
5. seznam ukončíme tagem </DL>.
Definice jednoduchého seznamu může být tedy následující:
<DL>
<DT>HTTP
<DD>Transportní protokol využívaný k přenosu souborů obsahujících popis WWW-stránek v jazyce HTML.
<DT>FTP
<DD>Transportní protokol používaný k přenosu souborů.
<DT>NNTP
<DD>Transportní protokol používaný k přenosu news.
</DL>
Seznamy mohou být do sebe libovolně vnořovány, tj. položka jednoho seznamu může být tvořena celým jiným seznamem. HTML-dokument obsahující:
<UL>
<LI>Evropa
<UL>
<LI>Německo
<LI>Francie
<LI>Velká Británie
<LI>Česká republika
</UL>
<LI>Asie
<UL>
<LI>Korea
<LI>Japonsko
<LI>Indie
</UL>
</UL>
Předformátovaný text
Pokud chceme do dokumentu zařadit například zdrojový text programu nebo tabulku vytvořenou z textových rámečků, je výhodné potlačit automatické zarovnávání textu podle velikosti okna a přepnout do neproporcionálního písma. Tento režim interpretace textu je v HTML používán mezi tagy <PRE> a </PRE>. Pro zahrnutí výpisu jednoduchého programu do dokumentu můžeme použít následující postup:
<PRE>
#include <stdio.h>
long f (long n) {
return( n==0 ? 1 : n * f(n-1) );
}
main() {
printf("%ld\n", f(10));
}
</PRE>
Pozorný čtenář si jistě povšiml drobné odlišnosti. Znaky `<' a `>' jsou v dokumentu nahrazeny výrazy (tzv. znakovými entitami) < a >. Je to z toho důvodu, že výše zmíněné znaky mají v HTML speciální význam a nemohou proto být použity ve svém původním významu. Podobně se musí zapisovat i znak `&', pro který existuje entita &. Pokud potřebujeme do hodnoty nějakého atributu (např. URL) vložit uvozovky, musíme použít jejich náhradu ".
V předformátovaném textu je omezena nabídka elementů, které můžeme používat. Bez obav však můžeme používat hypertextové odkazy (<A ...>).
Začleňování citátů
Dalším elementem, o kterém jsme se doposud nezmínili, je <BLOCKQUOTE>. Obvykle se využívá, pokud do dokumentu zahrnujeme delší citaci nějakého díla. Text umístěný mezi <BLOCKQUOTE> a </BLOCKQUOTE> je od ostatního textu oddělen malou vertikální mezerou a je obvykle zleva (či z obou stran) odsazen:
Dílo B. Henryho je mnohdy velmi kontroverzní, jako například
<CITE>Zenonova aporie Achilles a želva</CITE>:
<BLOCKQUOTE>
Zenon ukazoval, že Achilles nedostihne želvu, i když běží
rychleji než ona.
<P>
Celá tisíciletí bylo toto zjištění chápáno jako paradox neboli
aporie. Nikdo si však neuvědomil skutečný paradox odtud
vyplývající: Achilles nedostihne želvu, která běží daleko
pomaleji než on, takže želva běžící před ním doběhne jeho.
<P>
PS. Zlí jazykové však tvrdí, že Achilles nedostihne želvu proto,
že nemá v pořádku achilovky.
</BLOCKQUOTE>
Podpisy stránek
Element <ADDRESS> je obvykle používán pro specifikování e-mailové adresy autora dokumentu. Většinou se uvádí na konci dokumentu a bývá zobrazována kurzívou. Pokud bychom chtěli uvést úplnou adresu (tj. několik řádků s ulicí, městem atd.), je zapotřebí explicitně určit konce řádků pomocí tagu <BR>. Ukázka těchto dvou možností zápisu adresy následuje:
<ADDRESS>Jiří Kosek -- xkosj06@vse.cz</ADDRESS>
<ADDRESS>
Výzkumný ústav nesmyslů<BR>
Jana Hůrky 7<BR>
Dolní Lhota<BR>
321 98<BR>
e-mail: info@vun.cz
</ADDRESS>
Poslední příklad přibližující zápis adres v HTML je správný, ale ve skutečnosti by vypadal spíše následovně:
<ADDRESS>
<A HREF="mailto:xkosj06@vse.cz">Jiří Kosek</A></ADDRESS>
<ADDRESS>
Výzkumný ústav nesmyslů<BR>
Jana Hůrky 7<BR>
Dolní Lhota<BR>
321 98<BR>
e-mail: <A HREF="mailto:info@vun.cz">info@vun.cz</A>
</ADDRESS>
Použití odkazů zvýrazní slova Jiří Kosek a info@vun.cz. Pokud na ně klikneme myší, otevře se okno poštovního programu, kde můžeme napsat zprávu, kterou chceme poslat na adresu specifikovanou atributem HREF.
TIP: Pokud chceme, aby odkaz neodkazoval na jiný dokument, ale umožnil zaslání elektronického dopisu, použijeme u atributu HREF místo běžného URL konstrukci mailto:e-mailová adresa.
|