HTML a tvorba WWW strßnek - 1. lekce
23.Φervna 1998 xskrivan@fi.muni.cz


1.1 Co je HTML

  Zkratka HTML znamenß HyperText MarkUp Language , co₧ v p°ekladu znamenß Nadtextov² znaΦkovacφ jazyk a prßv∞ tak, by se dal charakterizovat tento jazyk pro vytvß°enφ www strßnek. Jazyk HTML se vyznaΦuje tφm, ₧e vzhled jednotliv²ch Φßstφ dokumentu urΦuje sv²mi HTML znaΦkami. (viz nφ₧e)

  HTML dokument je v podstat∞ b∞₧n² textov² soubor, kter² mß b²t p°edevÜφm nositelem informace. Tj., v ₧ßdem p°φpad∞ by strßnka na lidi nem∞la hßzet vÜelijakΘ animovanΘ ksichtφky, blikajφcφ a b∞₧φcφ text, h²°it barvami. Takovß strßnka je mo₧nß efektnφ po grafickΘ strßnce, ale z hlediska hlavnφho ·Φelu, je naprosto nevhodnß. Ka₧d² objekt, kter² blikß, rotuje Φi jezdφ, odvßdφ pozornost od vlastnφho informaΦnφho obsahu strßnky, ten je nep°ehledn², Üpatn∞ Φiteln² a tudφ₧ nßsledn∞ velmi ·navn² na oΦi. Tolik o zßkladnφch pravidlech tvorby strßnek. Nebude v∙bec na Ükodu, kdy₧ se jimi budete alespo≥ trochu °φdit.

  Soubor definujφcφ HTML strßnku mφvß p°φponu .htm (v NovellovskΘm prost°edφ) a p°φponu .html (v UnixovskΘm prost°edφ). JinΘ p°φpony se nedoporuΦujφ, jednak n∞jakΘ mohou mφt sv∙j specißlnφ v²znam, a jednak prohlφ₧eΦ by nemusel v₧dy pochopit, ₧e se jednß prßv∞ o HTML dokument. Kup°φkladu, kdy₧ dßte HTML dokumentu p°φponu .txt, pak takov² zdrojov² soubor zobrazφ jako plain text.

  DalÜφ vlastnostφ jazyka HTML je, ₧e pokud prihlφ₧eΦ narazφ na neznßmou HTML znaΦku, tak ji prost∞ ignoruje a chovß se tak, jak kdyby tam nebyla. Je takΘ pot°eba vzφt v ·vahu, ₧e HTML ignoruje vÜechny nadbyteΦnΘ mezery. Pokud chcete do dokumentu vlo₧it nap°. nov² °ßdek, nebo vφce jak jednu mezeru, musφte pou₧it formßtovacφch tag∙ jazyka HTML.

1.2 Zßkladnφ struktury HTML dokumentu

Zßkladnφmi a b∞₧n∞ u₧φvan²mi strukturami HTML dokumentu jsou:

  To, jak bude text v dane chvφli vypadat, tzn, jestli to bude hol² text, nebo textovß informace bude rozvr₧ena do tabylky, nebo seznamu, urΦujφ HTML znaΦky - odborn∞ tagy . Tedy, tak jak je nap°. v programovacφm jazyku zßkladnφm stavebnφm prvkem p°φkaz, tak p°i tvorb∞ HTML dokument∙ to je TAG.

1.3 Tagy

  Tag je libovoln² n-znakov² identifikßtor ulo₧en² ve dvou zßvorkßch: <identifikßtor>. Za prvnφ zßvorkou nesmφ b²t mezera! Tagy obecn∞ d∞lφme do dvou zßkladnφch skupin:
PßrovΘ tagy se vyznaΦujφ tφm, ₧e jsou uvozovßny poΦßteΦnφ znaΦkou <tag> , ze kterou nßsleduje n∞jak² objekt, zpravidla n∞jak² text, a ukonΦen ukonΦovacφ znaΦkou </tag> . P°φkladem n∞jakΘ pßrovΘ znaΦky je: <font> <i> <body> <center> <a> <table> P°φklady pou₧itφ ukazuje nßsledujφcφ tabulka:

<i> text bude kurzφvou </i>
<b> text bude tuΦn∞ </b>


NepßrovΘ tagy jsou znaΦky tvaru <tag atributy..hodnoty....> , kterΘ nepopisujφ, jak bude vypadat objekt uzav°en² mezi poΦßteΦnφ a koncovou znaΦkou, ale v mφst∞ volßnφ zavedou na strßnku n∞jak² objekt. (nap°. obrßzek, Φßru ...). P°φkladem nepßrov²ch tag∙ jsou: <img> <hr> <input> <meta> <br> <p>

  Ka₧d² tag m∙₧e obsahovat vedle svΘho identifikßtoru atributy. Pod pojmem atributy si lze nejjednoduÜeji p°edstavit volby, urΦujφcφ n∞jakΘ nastavenφ nebo vlastnosti. Ka₧d² atribut pak mß definovanou svou hodnotu. Po°adφ zapsan²ch atribut∙ v tagu je libovolnΘ. Jak zapsat n∞jakou HTML znaΦku i s jejφmi atributy, bude asi nejlΘpe vid∞t na nßsledujφcφm p°φkladu tagu FONT, kter² definuje font pφsma:

<font size=5 color="Blue"> N∞jak² text </font>
V²sledek bude takov²: N∞jak² text


  Tagy lze do sebe vno°ovat. Pomocφ vno°ovßnφ se mnohdy dosßhne velmi snadno p∞kn²ch efekt∙. P°i vno°ovßnφ HTML znaΦek je t°eba mφt na pam∞ti, ₧e znaΦky se musφ ukonΦovat v prßv∞ opaΦnΘm po°adφ, ne₧ jak byly volßny. P°φklad viz tabulka:

<b> <i> text bude tuΦnou kurzφvou </i> </b>


Shrnutφ:

[Zp∞t] [Zm∞na k≤dovßnφ]