V předchozím článku jsme si vytvořili záhlaví stránky. Nyní si vytvoříme zbývající oddíly tak, aby všechny informace na stránce byly uspořádány přehledně a byly pokud možno dobře čitelné jak na monitorech s vysokým rozlišením, tak i na monitorech s nízkým rozlišením.
Pokud si otevřeme stránku index.html v prohlížeči ve stavu, jak jsme si příklad rozpracovali minule, vidíme, že záhlaví je umístěné uprostřed, ale navigační menu je vysunuto doleva. My bychom však potřebovali, aby obsah stránky byl upraven zhruba do této podoby:
Otevřeme tedy pomocí programu TopStyle soubor styly.css a nadefinujeme si zde další třídy pro značku <div>, kterou v HTML kódu používáme pro vytvoření jakéhosi oddílu či oblasti stránky.
Krásné webové stránky snadno vytvoříte pomocí MS Frontpage. Pomocníkem Vám bude náš on-line kurz Tvorba webových stránek.
Tuto novou třídu si zapíšeme do souboru hned za třídu div.head, kterou jsme si vytvořili minule. Pomocí ikony NewSelector vyvoláme tedy již známé dialogové okno, které nastavíme takto:
A můžeme pokračovat definicí vlastností. Naším cílem v tomto případě je, aby vše, co bude na stránce, se zobrazovalo tak, aby to vypadalo jako pokračování záhlaví. Použijeme tedy opět vlastnosti:
margin-left:auto;
margin-right:auto;
width: 730px;
a pro lepší názornost si zadáme jako další vlastnost i barvu pozadí, tedy:
background-color: #FFF8DC;
Nyní otevřeme stránku index.html pomocí HTML…