Untitled - Vitajte na stránkach www.einsty.hostujem.sk
Untitled - Vitajte na stránkach www.einsty.hostujem.sk
Untitled - Vitajte na stránkach www.einsty.hostujem.sk
You also want an ePaper? Increase the reach of your titles
YUMPU automatically turns print PDFs into web optimized ePapers that Google loves.
I N T E R N E T<br />
Vytvárame WWW stránky / 3. èas<br />
Vítam vás pri tretej èasti nášho seriálu<br />
o vytváraní WWW stránok v jazyku HTML.<br />
O èom bude? Ukážeme si prácu s <strong>na</strong>dpismi,<br />
vytvoríme zoz<strong>na</strong>my s odrážkami a vysvetlíme<br />
jednu z <strong>na</strong>jdôležitejších vecí –<br />
tvorbu hypertextových odkazov.<br />
Práca s <strong>na</strong>dpismi<br />
V predchádzajúcej èasti sme si vysvetlili,<br />
ako meni ve¾kos <strong>na</strong>dpisov pomocou tagov<br />
, , , , ,<br />
. Ako ste si urèite všimli, <strong>na</strong>dpisy sú<br />
vždy zarovnávané v¾avo. Teraz si ukážeme,<br />
ako ich zarov<strong>na</strong> v¾avo (left), vpravo<br />
(right), <strong>na</strong> stred (center) a do bloku (justify).<br />
So zarovnávaním do bloku (justify) sa<br />
nestretávame <strong>na</strong> ve¾kom množstve stránok,<br />
pretože bolo zavedené až štandardom<br />
HTML 4.0 a vie o òom len málo ¾udí.<br />
Tu sú príklady <strong>na</strong> zarovnávanie:<br />
v¾avo<br />
v¾avo<br />
vpravo<br />
vpravo<br />
<strong>na</strong> stred<br />
<strong>na</strong> stred<br />
do bloku<br />
do bloku do bloku do bloku do bloku<br />
Nadpisy majú ešte jednu výhodu. Automaticky<br />
pred nimi a za nimi <strong>na</strong>sleduje prechod<br />
<strong>na</strong> nový riadok.<br />
Príklad:<br />
prvý riadok <strong>na</strong>dpis <br />
druhý riadok<br />
Ukážka:<br />
prvý riadok<br />
<strong>na</strong>dpis<br />
druhý riadok<br />
Ako sme už uviedli v predchádzajúcej<br />
èasti, s <strong>na</strong>dpismi treba zaobchádza ve¾mi<br />
opatrne a <strong>na</strong>jmä <strong>na</strong>dpis treba použi<br />
pre lepšiu preh¾adnos <strong>na</strong> stránke iba<br />
raz – ako názov stránky.<br />
To¾ko <strong>na</strong>dpisy a teraz prejdime k zoz<strong>na</strong>mom.<br />
Èíslovaný zoz<strong>na</strong>m<br />
Èíslovaný zoz<strong>na</strong>m sa uvádza tagom <br />
(ordered list) a ukonèuje . Položky<br />
v tomto zoz<strong>na</strong>me sa uvádzajú tagom<br />
. Každá položka v tomto zoz<strong>na</strong>me je<br />
oz<strong>na</strong>èená èíslom alebo písmenom.<br />
Príklad:<br />
<br />
raz<br />
dva<br />
tri<br />
<br />
Výsledok príkladu:<br />
1. raz<br />
2. dva<br />
3. tri<br />
Ako vidíme <strong>na</strong> výsledku príkladu, všetky<br />
položky zoz<strong>na</strong>mu sú oz<strong>na</strong>èené èíslami.<br />
Oz<strong>na</strong>èovanie položiek v zoz<strong>na</strong>me môžeme<br />
definova parametrom TYPE pod¾a tejto<br />
tabu¾ky:<br />
TYPE=A ve¾ké písmená (A, B, C ...)<br />
TYPE=a malé písmená (a, b, c ...)<br />
TYPE=I ve¾ké rím<strong>sk</strong>e èíslice (I, II, III ...)<br />
TYPE=i malé rím<strong>sk</strong>e èíslice (i, ii, iii ...)<br />
TYPE=1 arab<strong>sk</strong>é èíslice (1, 2, 3 ...)<br />
Predvolene sú položky v tabu¾ke èíslované<br />
od prvého èísla (písme<strong>na</strong>). Ak chceme èíslova<br />
<strong>na</strong>príklad od tretieho písme<strong>na</strong> abecedy,<br />
použijeme parameter START s hodnotou<br />
3.<br />
Príklad:<br />
<br />
raz<br />
dva<br />
tri<br />
<br />
Výsledok vyzerá takto:<br />
c. raz<br />
d. dva<br />
e. tri<br />
Vysvetlenie: položky v zoz<strong>na</strong>me sú oz<strong>na</strong>èované<br />
písme<strong>na</strong>mi, pretože parameter<br />
TYPE je <strong>na</strong>stavený <strong>na</strong> a., položky sú z<strong>na</strong>èené<br />
od písme<strong>na</strong> c, pretože parameter<br />
START je <strong>na</strong>stavený <strong>na</strong> 3 a c je tretie písmeno<br />
abecedy.<br />
Neèíslovaný zoz<strong>na</strong>m<br />
Neèíslovaný zoz<strong>na</strong>m sa líši od èíslovaného<br />
<strong>na</strong>jmä tým, že sa uvádza tagom <br />
(UL=unnumbered list) a konèí . Položky<br />
sú takisto uvádzané tagom .<br />
Príklad:<br />
<br />
raz<br />
dva<br />
tri<br />
<br />
Výsledok:<br />
l raz<br />
l dva<br />
l tri<br />
Aj pri neèíslovanom zoz<strong>na</strong>me môžeme<br />
použi parameter TYPE. Pri tomto zoz<strong>na</strong>me<br />
je možné použi tieto hodnoty:<br />
l TYPE=disc - plné kolie<strong>sk</strong>o<br />
TYPE=circle - prázdne kolie<strong>sk</strong>o<br />
°<br />
n TYPE=square - štvorec<br />
Vnorené zoz<strong>na</strong>my<br />
Èíslované zoz<strong>na</strong>my môžeme ¾ubovo¾ne<br />
kombinova . Môžeme <strong>na</strong>príklad vnori<br />
èíslovaný do neèíslovaného zoz<strong>na</strong>mu.<br />
Dostaneme kombináciu èíslovaných a neèíslovaných<br />
položiek.<br />
Príklad:<br />
<br />
Prvá èíslovaná položka<br />
<br />
neèíslovaná<br />
ïalšia neèíslovaná<br />
<br />
Druhá èíslovaná položka<br />
Tretia<br />
Štvrtá rozvetvená<br />
<br />
<strong>na</strong> prvú<br />
druhú<br />
a tretiu položku<br />
<br />
<br />
Výsledok príkladu:<br />
1. Prvá èíslovaná položka<br />
° neèíslovaná<br />
ïalšia neèíslovaná<br />
°<br />
2. Druhá èíslovaná položka<br />
3. Tretia<br />
4. Štvrtá rozvetvená<br />
a. <strong>na</strong> prvú<br />
b. druhú<br />
c. a tretiu položku<br />
Upozornenie: Všetky tagy sú párové,<br />
preto by sme nemali zabúda <strong>na</strong> ich uzatváranie.<br />
Hypertextové odkazy<br />
Hypertextové odkazy sú jedným z <strong>na</strong>jdôležitejších<br />
prvkov webových stránok. Ich<br />
základom je element (anchor – kotva).<br />
Základná štruktúra hypertextového<br />
odkazu je takáto:<br />
názov<br />
odkazu<br />
Text súbor, <strong>na</strong> ktorý sa odkazuje <strong>na</strong>hradíme<br />
názvom súboru, <strong>na</strong> ktorý odkazuje.<br />
Ak je to súbor s príponou HTM,<br />
HTML, ASP, PHP alebo podobnou, otvorí<br />
sa daný súbor v okne prehliadaèa. Ak je to<br />
súbor iného typu, prehliadaè ponúkne<br />
spustenie alebo uloženie tohto súboru<br />
alebo spustí aplikáciu, ku ktorej je daný<br />
typ súboru asociovaný.<br />
Text názov odkazu <strong>na</strong>hradíme slovom<br />
alebo vetou, ktorú má používate¾ vidie<br />
v prehliadaèi.<br />
Príklad:<br />
<br />
tento odkaz<br />
Výsledok:<br />
tento odkaz<br />
Tento odkaz nás zavedie <strong>na</strong> stránku nášho<br />
èasopisu. Neodkazuje <strong>na</strong> konkrétny súbor,<br />
preto bude h¾ada súbor index alebo default.<br />
Môžeme vytvori aj odkaz priamo <strong>na</strong><br />
súbor <strong>na</strong> serveri.<br />
Príklad:<br />
Tipy a Triky pre<br />
Windows<br />
Výsledok:<br />
Tipy a Triky pre Windows<br />
Tento odkaz nás zavedie <strong>na</strong> stránku servera<br />
<strong>www</strong>.tipyatriky.<strong>sk</strong> so zameraním <strong>na</strong><br />
tipy a triky pre Windows.<br />
Nabudúce<br />
Do <strong>na</strong>sledujúcej èasti seriálu si môžete<br />
precvièi tvorbu zoz<strong>na</strong>mov, ich vnáranie<br />
a tvorbu hypertextových odkazov. V ïalšej<br />
èasti si povieme podrobnejšie o odkazoch<br />
a o obrázkoch.<br />
Igor Kulman<br />
130 PC REVUE 12/2001
Change language