CSS a kaskáda
Nezkušení kodéři by si měli dát pozor na pravidla kaskády, protože v ní číhá mnoho nástrah a mohou si tím natropit dost potíží, o kterých ani nemusí vědět.
Nechci tu rozebírat problematiku kaskády výrazně do hloubky, jen upozorním na jeden faktor při psaní stylů. Pusťme se do toho.
Při úpravách stylů, které psal někdo přede mnou často narážím na nejednotnost stylopisu. Podívejte se na příklad: špatná kaskáda.
Na tomto jednoduchém příkladu jistě vidíte, kde je chyba. První
definice určuje vlastnosti obecně pro každý odstavec v elementu
.post a druhá definice má určovat vlastnosti pro odstavec
s datem a rubrikou. První definice má však vyšší váhu, takže je
upřednostněna před druhou a na odstavec s datem a kategorií nebudou
vztaženy vlastnosti v druhé definici.
Podívejte se, jak to má správně vypadat: správná kaskáda.
Zde jsou už v druhé definici uvedeny rodičovské selektory a definice tak získává vyšší váhu než definice pro obecný odstavec.
Z toho vyplývá, že se vyplatí předcházet těmto problémům a
v definicích uvádět všechny rodičovské selektory.
Také je dobré si rozmyslet, zda budete u selektoru třídy a
identifikátoru uvádět značku elementu, protože svůj vliv na určení váhy
definice to taky má. Tzn. jestli takhle: .postmeta
nebo takhle: p.postmeta. Lepší je tyto
dva způsoby v jednom stylopisu nemíchat.
Tyto rady samozřejmě neplatí ve 100 % případů, naopak. Obecné definice
pro odkazy, vodorovné čáry, akronymy, odstavce apod. je dobré uvádět jen
značkou prvku, bez rodičovských selektorů (tzn. a{ … }
hr{ … } acronym{ … }
p{ … }). Já osobně jsem zvyklý psát obecné definice
na začátek stylopisu a v další části, kde už definuji vlastnosti
podle umístění prvků (např. #content h2{ … })
doplňuji obecné definice ze začátku stylopisu o specifické vlastnosti
dle umístění prvku. Naopak na konec stylopisu umisťuji obecné třídy,
které aplikuji na všechny možné elementy v dokumentu (např.
.clear{ … } .hidden{ … }).
Závěr
Příklad, který jsem uvedl je dost primitivní, ale věřte, že při psaní složitějších stylopisů můžete na zmíněný problém snadno narazit. Pokud píšete opravdu rozsáhlý stylopis, je to podle mého názoru nejsložitější problém na odhalení. Proto se vyplatí držet se určitých pravidel, poctivě přepisovat rodičovské selektory a stanovit si vlastní pravidla pro psaní, která vám jej ulehčí.
Pokud se rozhodnete porušit některé z těchto pravidel (např. některému specifickému prvku, umístěnému hluboko ve struktuře dokumentu nepředepíšete rodičovské selektory), měli byste bezpečně vědět, co děláte, jinak si velmi pravděpodobně zaděláte na budoucí problémy.
