Výhody CSS
Používání kaskádových stylů ve srovnání se samotným HTML v praxi přináší výhody:
- Rozsáhlejší možnosti formátování. Například pro formátování bloku textu – tj. určení vzdálenosti od jejich elementu či okraje stránky nenabízí HTML nic. CSS má vlastnosti padding[7] a margin[8]. V HTML by bylo potřeba vytvořit složitou konstrukci vnořených tabulek.[9]
- Jednodušší údržba webové prezentace. Pokud chceme změnit nějaký detail, jako třeba barvu nadpisu, nemusíme složitě procházet HTML kód nebo různé HTML šablony, ale můžeme změnit pouze jednu vlastnost v CSS souboru, který je přilinkován ke všem stránkám.
- Oddělení struktury a stylu. V jednom (HTML) dokumentu budeme mít pouze sémanticky označen obsah a v druhém (CSS) dokumentu máme definice vzhledu stránek. Tím dosáhneme snadnějšího strojového zpracování samotného obsahu stránek, do kterého se nám nepletou prvky definující vzhled.
- Cachování stylů – webový prohlížeč si může soubor se styly uložit do cache paměti, čímž může být dosaženo zrychlení načtení stránku. Na druhou stránku při použití externího CSS souboru dochází k dalšímu HTTP požadavku navíc oproti tomu, když bychom použili buď inline CSS nebo přímo formátování HTML.
- CSS vlastnosti jednotlivých elementů můžeme dynamicky měnit pomocí Javascriptu.[10]
- Z pomocí CSS můžeme jednoduše formátovat i jakýkoliv jazyk XML.[11]
- Mohou také existovat různé styly pro různá výstupní zařízení. Jednoduše tak můžeme nadefinovat různý styl pro tisk, projekci, mobil, PDA, běžný prohlížeč či dokonce pro každý prohlížeč jiný styl. Specifikace CSS nezapomínají ani na zrakově postižené – je možno napsat styly pro hlasový syntetizátor nebo hmatovou čtečku Braillova písma.[12]
- Koncový uživatel si může napsat svůj vlastní CSS styl pro libovolnou stránku. Většina prohlížečů nějakým způsobem podporuje uživatelské styly, takže uživatel si může například nastavit, aby měl všechny odkazy na všech webech vždy podtržené nebo aby na tomto konkrétním webu mělo písmo vždy černou barvu.[13]
- V kombinaci s Javscriptem mohou vzniknout účinné bookmarklety, které mohou různě vylepšovat vzhled stránky. Například odstranit všechny obrázky na pozadí, změnit pozadí na bílé a písmo na černé apod. [14]
Absolutní pozice
Relativní pozice
Fixní pozice