Příklad tabulky stylů pro svislou navigační lištu.

Tabulku vytvoříme nejlépe ve standardním textovém editoru (např. Notepad), a uložíme s příponou .css do adresáře svých webových stránek na www-serveru.

BODY        {background-image:url(images/urbtextb.gif)}
A           {font-family: arial,helvetica,sans-serif; font-size: 8pt; text-decoration:none; margin-bottom:10px}
A:link      {color:#ffffff; border-style:outset}
A:visited   {color:#ffffff; border-style:outset}
A:active    {color:#ffffff; border-style:outset}
A:hover     {color:#FFFFFF; border-style:inset}
A.levelsame {background-color:#000080; width:110px;}
A.leveldown {background-color:#008000; width:110px;}
A.levelup   {background-color:#a00000; width:110px;}

Pro uživatele znalé kaskádních stylů není třeba mnoho vysvětlovat, pro ty méně znalé jsou důležité 2 údaje:

1. V řádku BODY uvádíme adresu obrázku pozadí. Pokud chcete pozadí jednobarevné, uveďte mezi složenými závorkami tento údaj:

background-color:#0000ff - v tomto případě bude pozadí modré (je to trojice hexadecimálních čísel, vyjadřující v tomto pořadí složky RGB).

2. V řádku A definujete typ, barvu a velikost písma v tlačítkách. Vzhledem k formátování tlačítek doporučuji měnit pouze font, a to pouze jako patkový (font-family:Times New Roman,serif, nebo bezpatkový (font-family: Arial, Helvetice, sans-serif).

Poznámka: Nedoporučuji měnit barvu tlačítek, abychom návštěvníky příliš nemátli.

ZPĚT