: sakne - CSS-triki

Anonim

:rootSelektors ļauj mērķa augstākā līmeņa "vecāku" elements DOM vai dokumenta koku. CSS Selectors 3. līmeņa specifikācijā tas ir definēts kā “strukturāla pseidoklase”, kas nozīmē, ka to lieto satura veidošanai, pamatojoties uz tā attiecībām ar vecāku un brāļu saturu.

Pārsvarā vairumā gadījumu jūs, iespējams, sastopaties, :rootattiecas uz tīmekļa vietnes elementu. HTML dokumentā htmlelements vienmēr būs augstākā līmeņa vecāks, tāpēc uzvedība :rootir paredzama. Tomēr, tā kā CSS ir ieveidošanas valoda, kuru var izmantot kopā ar citiem dokumentu formātiem, piemēram, SVG un XML, šajos gadījumos :rootpseidoklase var norādīt uz dažādiem elementiem. Neatkarīgi no iezīmēšanas valodas, :rootdokumenta kokā vienmēr tiks atlasīts dokumenta augšējais elements.

Zemāk esošajā piemērā :rootpseidoklases selektors tiek izmantots, lai izveidotu fona krāsu aiz elementa. Šajā gadījumā to pašu efektu varētu panākt, tā vietā izmantojot htmlCSS elementu selektoru.

Pārbaudiet šo pildspalvu!

Apskates vietas

  • Kaut gan :rootatlasītājs, gan htmlatlasītājs mērķē uz vieniem un tiem pašiem HTML elementiem, var būt noderīgi zināt, ka :rootpatiesībā tam ir augstāka specifika. Pseidoklases selektoriem (bet ne pseidoelementiem) ir tāda pati specifika kā klasei, kas ir augstāka nekā pamatelementu atlasītājam.

Pārlūka atbalsts

Chrome Safari Firefox Opera IE Android iOS
9,5+ IE9 +