:rootVolič vám umožní zamerať sa na najvyššej úrovni, "materská" element v DOM, alebo strom dokumentu. Je definovaný v špecifikácii CSS Selectors úrovne 3 ako „štrukturálna pseudotrieda“, čo znamená, že sa používa na štýlovanie obsahu na základe jeho vzťahu s nadradeným a súrodeneckým obsahom.
V drvivej väčšine prípadov, s ktorými sa pravdepodobne stretnete, sa :rootodkazuje na prvok na webovej stránke. V dokumente HTML bude htmlelementom vždy rodič na najvyššej úrovni, takže jeho správanie :rootje predvídateľné. Pretože je však CSS štýlovým jazykom, ktorý je možné použiť s inými formátmi dokumentov, ako sú SVG a XML, môže :rootpseudotrieda v týchto prípadoch odkazovať na rôzne prvky. Bez ohľadu na značkovací jazyk :rootvždy vyberie najvyšší prvok dokumentu v strome dokumentu.
V nasledujúcom príklade :rootsa na vytvorenie farby pozadia za prvkom používa selektor pseudo-triedy . V takom prípade by sa rovnaký efekt dal dosiahnuť použitím htmlselektora prvkov v našom CSS.
Body záujmu
- Zatiaľ čo
:rootselektor ajhtmlselektor zacieľujú na rovnaké prvky HTML, môže byť užitočné vedieť, že:rootmá v skutočnosti vyššiu špecifickosť. Selektory pseudo-tried (ale nie pseudoelementy) majú špecifickosť rovnakú ako špecifickosť triedy, ktorá je vyššia ako selektor základných prvkov.
Podpora prehľadávača
| Chrome | Safari | Firefox | Opera | IE | Android | iOS |
|---|---|---|---|---|---|---|
| mňam | mňam | mňam | 9,5+ | IE9 + | mňam | mňam |