:rootSelektor omogućuje ciljanje na najvišoj razini „roditelja” elementa u dom ili dokument stablo. U specifikaciji CSS Selectors Level 3 definiran je kao „strukturna pseudo-klasa“, što znači da se koristi za oblikovanje sadržaja na temelju odnosa s roditeljskim sadržajem i sadržajem.
U ogromnoj većini slučajeva s kojima ćete se vjerojatno susresti, :rootodnosi se na element na web stranici. U HTML dokumentu htmlelement će uvijek biti roditelj najviše razine, pa je ponašanje :rootpredvidivo. Međutim, budući da je CSS jezik za oblikovanje koji se može koristiti s drugim formatima dokumenata, kao što su SVG i XML, :rootpseudo-klasa se u tim slučajevima može odnositi na različite elemente. Bez obzira na označni jezik, :rootuvijek će odabrati najviši element dokumenta u stablu dokumenta.
U primjeru ispod, :rootselektor pseudo-klase koristi se za stvaranje pozadinske boje iza elementa. U ovom bi se slučaju isti učinak mogao postići korištenjem htmlbirača elemenata u našem CSS-u.
Točke interesa
- Iako i
:rootselektor ihtmlselektor ciljaju iste HTML elemente, možda bi bilo korisno znati da:rootzapravo ima veću specifičnost. Selektori pseudo-klase (ali ne i pseudo-elementi) imaju specifičnost jednaku specifičnosti klase, koja je veća od selektora osnovnog elementa.
Podrška preglednika
| Krom | Safari | Firefox | Opera | IE | Android | iOS |
|---|---|---|---|---|---|---|
| Da | Da | Da | 9,5+ | IE9 + | Da | Da |