# Cascading Style Sheets

### Z Wikipedie, otevřené encyklopedie

CSS je zkratka pro anglický název Cascading Style Sheets, česky tabulky kaskádových stylů. Je to jazyk pro popis způsobu zobrazení stránek napsaných v jazycích HTML, XHTML nebo XML.

Jazyk byl navržen standardizační organizací W3C. Byly vydány zatím dvě verze specifikace CSS1 a CSS2 (plus CSS 2.1), pracuje se na verzi CSS3 (rok 2006).

Hlavním smyslem je umožnit návrhářům oddělit vzhled dokumentu od jeho struktury a obsahu. Původně to měl umožnit už jazyk HTML, ale v důsledku nedostatečných standardů a konkurenčního boje výrobců prohlížečů se vyvinul jinak. Starší verze HTML obsahují celou řadu elementů, které nepopisují obsah a strukturu dokumentu, ale i způsob jeho zobrazení. Z hlediska zpracování dokumentů a vyhledávání informací není takový vývoj žádoucí.

## [editovat] 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

CSS nabízí rozsáhlejší formátovací možnosti než samotné HTML Napr. pro formátování bloku textu – tj. urcení vzdálenosti od jejich elementu ci okraje stránky nenabízí HTML nic. CSS má vlastnosti padding a margin. V HTML by bylo potreba vytvorit složitou konstrukci vnorených tabulek.

- konzistentní styl

Na všech stránkách webové prezentace by mely být všechny nadpisy stejné úrovne, seznamy, zduraznené cásti textu apod. stejného stylu. S použitím formátovacích možností HTML je to obtížné – u každého objektu v každém dokumentu se vzhled objektu stále znovu nastavuje. S použitím CSS je to velmi jednoduché. Vytvorí se soubor stylu, který se pripojuje k HTML dokumentu. Ve všech dokumentech jsou pak objekty stejného vzhledu.

- oddělení struktury a stylu
- dynamická práce se styly

Provést zmenu stylu webu, který pro formátování vzhledu využívá jen možnosti HTML, znamená, najít na nahradit všechny znacky a zmenit atributy mnoha dalších znacek. V prípade používání CSS znamená zmena stylu webu prepsání jediného souboru – souboru stylů.

- formátování XML dokumentů
- větší kompatibilita alternativních webových prohlížečů
- kratší doba načítání stránky

Výhodou CSS oproti starému formátování v HTML je, že kód a obsah webu je uložen v souboru .html a veškerý design a formátování se načítá z jednoho souboru .css, který je většinou společný pro celý web. To znamená, že pokud máte v plánu změnu designu webu, stačí změnit pouze jeden soubor .css a změna se aplikuje na celý web.

Mohou také existovat různé styly pro různá výstupní zařízení. Webdesigner má tak možnost, prostřednictvím CSS stylů, dokumentu určit, jak bude vypadat na papíře, při projekci či na PDA apod. Specifikace CSS nezapomínají dokonce ani na zrakově postižené - je možno napsat styly pro hlasový syntetizátor nebo hmatovou čtečku Braillova písma.

Je také možnost upravit formátování podle prohlížeče, kterým si uživatel danou stránku zobrazuje. Jednoduše si vytvoříte více souborů .css (např. styl1.css a styl2.css) a podle prohlížeče, který si o stránku požádá připojíte jiný soubor. Tím se dá eliminovat problém různé interpretace kódu jednotlivými prohlížeči.

## [editovat] Nevýhody

Hlavní nevýhodou CSS je zatím stále špatná podpora v majoritních prohlížečích. Různé prohlížeče interpretují stejný CSS kód jinak a je někdy velmi obtížné jej napsat tak, aby se na všech (resp. na několika vybraných) prohlížečích výsledek zobrazil stejně. Situace se ale v roce 2006 značně zlepšuje, v souvislosti s tím se s napětím očekává příchod Internet Exploreru 7, který by měl postupně vytlačit svého předchůdce IE 6, který byl častým zdrojem problémů.

## [editovat] Syntaxe

Stylový předpis se skládá z posloupnosti pravidel. Každé pravidlo určuje vzhled některého elementu dokumentu, nebo skupiny elementů. Pravidlo začíná tzv. selektorem, který specifikuje („adresuje“) skupinu elementů. Selektor je následován seznamem deklarací, které určují vzhled vybrané skupiny elementů. Celý seznam je uzavřen ve složených závorkách a jednotlivé deklarace jsou odděleny středníkem (tj. za poslední deklarací středník už být nemusí).

Příklad stylu:

    h1 {                   /* vzhled nadpisu první úrovně */
        margin: 5px;       /* okraj šířky 5 pixelů        */
        font-size: 12pt    /* velikost fontu 12 bodů      */
       }
    p  {                     /* styl odstavce       */
        text-align: center;  /* text centrovat      */
        line-height: 10pt;   /* výška řádku 10 bodů */
       }

| Tento článek týkající se softwaru je pahýl. Můžete pomoci Wikipedii tím, že jej vhodně rozšíříte.

## [editovat] Externí odkazy

- CSS2 - kaskádové styly druhé generace - průvodce CSS2 (česky)
- CSS3 - kaskádové styly třetí generace - průvodce CSS3 (česky)
- Knihovna CSS - instantní kaskádové styly (hotová řešení, česky)
- Popis CSS podle W3C
- http://www.jakpsatweb.cz/css/ - tutoriál

Citováno z „http://cs.wikipedia.org../../../c/a/s/Cascading_Style_Sheets_981c.html“

Kategorie: Softwarové pahýly | Standardy W3C | Počítačové jazyky

##### Views

- Článek
- Diskuse
- Aktuální verze

##### Hledání

##### V jiných jazycích

- العربية
- Bosanski
- Català
- Dansk
- Deutsch
- English
- Esperanto
- Español
- Eesti
- Euskara
- فارسی
- Suomi
- Français
- Gàidhlig
- Galego
- עברית
- Magyar
- Bahasa Indonesia
- Íslenska
- Italiano
- 日本語
- 한국어
- Lietuvių
- Nederlands
- ‪Norsk (nynorsk)‬
- ‪Norsk (bokmål)‬
- Polski
- Português
- Română
- Русский
- Slovenčina
- Slovenščina
- Svenska
- ไทย
- Türkçe
- Tiếng Việt
- 中文