La pseudo-classe :root permet de cibler la racine de l'arbre représentant le document. Pour un document HTML, :root ciblera donc l'élément <html> et aura le même comportement que le sélecteur html mais sa spécificité sera plus forte.
Syntaxe
:root { style properties }
Exemples
:root peut être utile lorsqu'on déclare des propriétés CSS personnalisées globales :
:root {
--main-color: hotpink;
--pane-padding: 5px 42px;
}
Spécifications
| Spécification | État | Commentaires |
|---|---|---|
| Selectors Level 4 La définition de ':root' dans cette spécification. |
Version de travail | Aucune modification. |
| Selectors Level 3 La définition de ':root' dans cette spécification. |
Recommendation | Définition initiale. |
Compatibilité des navigateurs
| Fonctionnalité | Chrome | Firefox (Gecko) | Edge | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|---|
| Support simple | 1 | 1.0 (1.7 ou moins) | (Oui) | 9 | 9.5 | 1.0 |
| Fonctionnalité | Android | Firefox Mobile (Gecko) | Edge | IE Mobile | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|---|
| Support simple | ? | ? | (Oui) | ? | ? | ? |