CSS
Autor: Petr Fiala
Klíčová slova: CSS, webdesign, W3C standardy
Synonyma: Cascading Style Sheets, kaskádové styly
Související pojmy:
nadřazené - HTML
podřazené - ---
Charakteristika
CSS (Cascading Style Sheets, česky kaskádové styly), je speciální programovací jazyk. Je to nadstavba značkovacích jazyků (HTML, XML), která umožňuje autorům popsat vzhled jejich dokumentů. Cílem CSS je oddělit popis struktury dokumentu od definice vzhledu (obsahu a formy). Pomocí stylů lze definovat formátovací vlastnosti (písmo, zarovnání, barvy atd.) pro každý logický prvek dokumentu (nadpisy, běžný text, odkazy atd.). Definice je pak uplatněna v celém dokumentu.
Historie
Vývoj CSS spravuje a specifikace jednotlivých verzí publikuje organizace World Wide Web Consortium (W3C). První návrh zveřejnil v roce 1994 Håkon Wium Lie. V prosinci roku 1996 pak byla vydána specifikace CSS level 1 (definuje všechny základní vlastnosti pro fonty, okraje, barvy atd.), v květnu 1998 CSS level 2 (rozšiřuje předchozí verzi o absolutně pozicované elementy, automatické číslování, zalamování stran, umí pracovat s textem psaným zprava doleva a další). Aktuální verzí je CSS 2.1 (level 2 revision 1) a pracuje se na verzi CSS level 3 (doplní nové selektory, styly okrajů a pozadí, vertikální text, prostředky pro interakci s uživatelem a mnohé další). Všechny verze jsou zpětně kompatibilní.
Použití
Připojení stylů
Tabulky kaskádových stylů mohou být součástí dokumentu HTML, nebo být umístěny v samostatném souboru. Ten se k dokumentu připojí během jeho načítání. Možné způsoby použití jsou tři:
- Přímá definice stylu - Pomocí atributu
stylemůžeme definovat styl konkrétnímu prvku zapsáním definice přímo do jeho značky. Takto definovaný přímý styl platí jen pro daný prvek (hodnoty se ale mohou dále dědit).
Příklad:
<a href=“stranka.html“ style=“color:green; font-size:smaller“>odkaz</a>
- Vložení tabulky stylů - Pro zápis tabulky stylů se používá značka <style>. Je párová a umisťuje se do hlavičky dokumentu (tj. mezi značky <head></head>). Jejím obsahem je seznam pravidel, neboli tabulka stylů.
Příklad:
<head> ... <style type=“text/css“> tabulka stylů </style> ... </head>
- Načtení externí tabulky stylů - V HTML slouží k připojování jiných dokumentů značka <link>. Pro připojení souboru s tabulkami stylů je třeba použít minimálně atributy rel=“stylesheet“, type=“text/css“ definující typ dokumentu a href=“adresa“ udávající adresu souboru s tabulkou stylů. Značka <link> musí být rovněž umístěna v sekci <head>.