:rootValitsin voit kohdistaa korkeimman tason ”emo” elementti DOM tai Dokumenttipuu. Se määritellään CSS Selectors -tason 3 spesifikaatiossa "rakenteelliseksi pseudoluokaksi", mikä tarkoittaa, että sitä käytetään sisällön tyylinmuokkaamiseen sen mukaan, mikä on sen suhde vanhempien ja sisarusten sisältöön.
Valtaosassa tapauksia, joita todennäköisesti kohtaat, :rootviittaa verkkosivun elementtiin. HTML-dokumentissa htmlelementti on aina korkeimman tason vanhempi, joten sen käyttäytyminen :rooton ennustettavissa. Koska CSS on kuitenkin muotoilukieli, jota voidaan käyttää muiden dokumenttimuotojen, kuten SVG ja XML, kanssa, :rootnäennäisluokka voi viitata erilaisiin elementteihin näissä tapauksissa. Merkintäkielestä riippumatta, se :rootvalitsee aina asiakirjan ylimmän elementin asiakirjapuusta.
Alla olevassa esimerkissä :rootpseudoluokan valitsinta käytetään taustavärin luomiseen elementin taakse . Tässä tapauksessa sama vaikutus voitaisiin saavuttaa käyttämällä htmlCSS: n elementtivalitsinta sen sijaan.
Kiinnostavat paikat
- Vaikka
:rootvalitsin jahtmlvalitsin molemmat kohdistuvat samaan HTML-elementit, voi olla hyödyllistä tietää, että:rooton itse asiassa suurempi spesifisyys. Pseudoluokan valitsimilla (mutta ei pseudoelementeillä) on spesifisyys yhtä suuri kuin luokan, joka on korkeampi kuin peruselementin valitsimen.
Selaimen tuki
| Kromi | Safari | Firefox | Ooppera | IE | Android | iOS |
|---|---|---|---|---|---|---|
| kyllä | kyllä | kyllä | 9,5+ | IE9 + | kyllä | kyllä |