Sélecteur :ROOT
Rôle
Le sélecteur root est une pseudo-classe désigné par la syntaxe :root qui permet de cibler la racine d’un document HTML, à savoir la balise <html>.
Note : ne pas confondre la balise <body> qui représente le corps du document (l’ensemble du contenu qui s’affiche) et la balise <html> qui représente le document en entier.
Dans l’exemple ci-dessous, la balise root fait référence au document HTML (bordure gris) et le sélecteur :root * permet de cibler tous les autres éléments à partir de la racine comme le corps du document body et le paragraphe p (bordure rose).
:root{
border-left: solid 10px silver;
}
:root *{
border-left: solid 10px pink;
padding: 5px;
}
<p>Lorem ipsum dolor sit amet</p>
Version : CSS3
Testez vous-même ce sélecteur
Compatibilité
Le sélecteur root est pris en charge par tous les principaux navigateurs
A partir d’Internet Explorer 9.
