La pseudo-clase :root de CSS selecciona el elemento raíz de un árbol que representa el documento. En HTML, :root representa el elemento <html> y es idéntico al selector html, excepto que su especificidad es mayor.

/* Selecciona el elemento raíz del documento:
   <html> en el caso de HTML */
:root {
  background: yellow;
}

Sintaxis

:root

Ejemplo

:root puede ser útil para declarar variables CSS globales:

:root {
  --main-color: hotpink;
  --pane-padding: 5px 42px;
}

Especificaciones

Especificación Estado Comentarios
Selectors Level 4
La definición de ':root' en esta especificación.
Working Draft Ningún cambio.
Selectors Level 3
La definición de ':root' en esta especificación.
Recommendation Definición Inicial.

Compatibilidad con navegadores

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidEdge MobileFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
:rootChrome Soporte completo 1Edge ? Firefox Soporte completo 1IE Soporte completo 9Opera Soporte completo 9.5Safari Soporte completo 1WebView Android ? Chrome Android ? Edge Mobile Soporte completo SiFirefox Android ? Opera Android ? Safari iOS ? Samsung Internet Android ?

Leyenda

Soporte completo  
Soporte completo
Compatibility unknown  
Compatibility unknown

Etiquetas y colaboradores del documento

Colaboradores en esta página: mdnwebdocs-bot, lajaso, JavierPeris, Xaviju
Última actualización por: mdnwebdocs-bot,