dnes je 7.7.2022

Input:

WWW stránky prakticky - 10. část

22.6.2007, , Zdroj: Verlag Dashöfer

V minulé lekci našeho výukového seriálu jsme vytvořili úvodní stránku našeho webu - index.html. Dnes si doplníme některé další styly, kterými upravíme vzhled textu.

Nejprve si v prohlížeči otevřeme již zpracovanou stránku index.html. Během minulé lekce jsme do ní vložili text. Pro text jsme dosud nezadali jakékoli vlastnosti, nevytvořili jsme styl. Z toho důvodu prohlížeč interpretuje text určitým standardním způsobem. Chtěli bychom však změnit vzhled textu - a to pokud se týká vzhledu nadpisu i pokud se týká ostatních odstavců.

Otevřeme tedy soubor styly.css pomocí programu TopStyle Lite, který používáme pro zpracování stylů. Pokud chceme, aby se ve veškerých prvcích, umístěných v těle stránky, používal jeden určitý druh písma (font), zadáme jej jako vlastnost značky body. Vytvoříme si tedy nový prázdný řádek za vlastností body-color - viz obrázek.

Nyní použijeme seznam StyleInspector, kde najdeme vlastnost font-family a nastavíme ji podle následujícího obrázku:

Z tohoto seznamu fontů bychom mohli vybrat také konkrétní jednotlivý font. Je však lepší vybrat skupinu fontů - jako na obrázku. To zajistí, že písmo se bude zobrazovat správně bez ohledu na operační systém počítače (naše stránky si mohou prohlížet také uživatelé počítačů MacIntosh apod.). Mohli bychom pokračovat i definicí dalších vlastností písma (např. velikost font-size, řez font-style, tučnost font-weight apod.), tyto vlastnosti je však vhodné definovat později u stylů, které budeme vytvářet pro konkrétní značky (např. pro nadpisy <h1>...<h2> apod.).

V prohlížeči si aktualizujeme stránku index.html, abychom zjistili, jak vypadá písmo nyní.

Na stránce (později i na ostatních stránkách) využíváme nadpisy, které se v HTML kódu zapisují pomocí značky <h1> (nadpis 1. úrovně, pro nadpisy dalších úrovní potom můžeme využívat značky <h2>, <h3> až <h6>).

Pokračujeme tedy s prací v souboru

Nahrávám...
Nahrávám...