Dnes bude řeč o grafických úpravách stránky, tedy o různých typech a velikostech písma, vkládání barev a seznamů. Jednotlivé kroky výuky, popisované v našem seriálu, můžete průběžně sledovat na internetové adrese http://abc.planeta.cz. Začátky jsou k vidění na abc.planeta.cz/krok1.htm a abc.planeta.cz/krok2.htm. Vždy bude uvedena adresa stránky, kterou právě popisujeme.
Formát písma
Když zadáváte HTML příkaz, záleží na prohlížeči, jak si daný příkaz vyloží a jak jej ve skutečnosti zobrazí. Můžete tedy volit tzv. fyzické nebo logické vyznačování písma. Fyzickým se rozumí použití takových tagů, které přímo určují konkrétní požadovanou podobu písma. Patří sem <B> pro tučné písmo, <I> pro kurzívu, <TT> pro neproporcionální písmo a další. Logické vyznačování znamená, že označujete úseky textu podle jejich významu. Například pro citace se užívá příkaz <CITE>, ten se obvykle zobrazí jako kurzíva. Chcete-li vložit krátkou ukázku kódu HTML stránky, zvolíte příkaz <CODE> a ten uvidíte napsaný nejspíše neproporcionálním písmem.
Praktická zkouška bude vypadat například takto:
<HTML>
<HEAD>
<TITLE>Moje první stránka</TITLE>
</HEAD>
<BODY>
<H1>Začínáme</H1>
<P>
Vyzkoušíme, jak fungují formáty písma, takže nejdříve <B>tučně</B>, potom <I>kurzívou</I>, <TT>neproporcionální písmo</TT> a nakonec <SMALL>písmo malé</SMALL>.
<P>
Nyní vložíme citaci klasika:
<CITE>Vím, že nic nevím.</CITE> <BR>
Nic na tom není.
</BODY>
Na výsledek se můžete podívat na adrese abc.planeta.cz/krok3.htm.
Barvy
Vedle příkazových značek (tagů) existují ještě tzv. atributy, které upřesňují zadávaný příkaz. Budete-li chtít přiřazovat barvy, pomocí atributů určíte, zda danou barvu bude mít pozadí, celý text na stránce, nebo pouze vybraná část textu. S barvami to v HTML není tak jednoduché. Abyste řekli prohlížeči, že chcete právě takový odstín barvy, musíte barvu definovat smícháním základních barev - červené, žluté a modré v určitém poměru. Takto lze vytvořit celou řadu odstínů, ale pro jednoduchost můžete použít 16 barev, které jsou v HTML předdefinovány a jsou jim přiřazena jména. Na adrese abc.planeta.cz/krok4.htm je seznam těchto barev s použitím atributu <FONT>. Barva, označovaná COLOR, se rovná anglickému názvu požadované barvy. Příkaz je párový, takže se zakončuje </FONT>.
Velikost
Na stránce s barvami je ukázka ještě dalších dvou druhů úpravy stránek. Jedním z nich je velikost písma. Vedle užití tagů <SMALL> a <BIG> můžete atribut FONT doplnit také příkazem pro velikost, což je SIZE. Tu opět lze určit buď pevně, a to čísly od 1 do 7 (7 je největší, normální je zhruba 3), nebo relativně v poměru k předchozímu textu. <FONT SIZE=-1> bude text relativně zmenšený o jednu (přesně to bylo použito na stránce s barvami). Velikost je upravena pro celý seznam barev. Příkaz FONT je samozřejmě párový.
Seznamy
Dalším prvkem je tvorba seznamu. Jednotlivé barvy jsou vždy na novém řádku, odsazeny od okraje a doplněny odrážkami v podobě teček. Pro tento druh seznamu se používá příkaz <UL> pro zahájení výčtu a na každou řádku před text se dává <LI> posunuté o jednu mezeru doprava. Seznam se zakončuje </UL>. Chcete-li mít seznam číslovaný, zvolíte příkaz <OL>. Nelíbí-li se vám bílé pozadí, můžete je změnit atributem BGCOLOR, tedy <BODY BGCOLOR=zvolená barva>. Stránka po změně pozadí je na abc.planeta.cz/krok5.htm. Je dobré dbát na to, aby stránky byly dobře čitelné, neboť například červené písmo na fialovém pozadí příliš nevynikne. Zobrazí-li se vám některá z barev jinak, než jste chtěli, je to právě tím, že prohlížeč ne zcela přesně interpretoval daný příkaz. Můžete si pomoci a zadat místo slovního názvu čísla a písmena pro požadovanou barvu, pomocné tabulky najdete v literatuře nebo na internetu.
