:root

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

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.

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

Sintaxis

Error: could not find syntax for this item

Ejemplo

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

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

Especificaciones

Specification
Selectors Level 4
# root-pseudo

Compatibilidad con navegadores

BCD tables only load in the browser