Clase Pseudo CSS :root

La pseudo-clase :root selecciona el elemento que representa la raíz del documento.

En HTML, el elemento raíz es siempre <html>.

En SVG y XML, la pseudo-clase :root puede referirse a un ancestro de nivel superior.

La pseudo-clase :root puede combinarse con pseudo-elementos (p. ej., ::after) y otras pseudo-clases (p. ej., :hover).

Versión

Selectors Level 4

Selectors Level 3

Sintaxis

Sintaxis de CSS :root

css

:root {
  css declarations;
}

Ejemplo de la pseudo-clase :root:

Ejemplo de código CSS :root

html

<!DOCTYPE html>
<html>
  <head>
    <style>
      :root {
        background-color: #8ebf42;
        padding: 2em;
      }
      body {
        background-color: #eee;
        padding: 1.5em;
      }
    </style>
  </head>
  <body>
    <h2>:root selector example</h2>
    <p>Lorem ipsum is simply dummy text</p>
  </body>
</html>

Try it Yourself »

Practice

¿Cuál es el propósito del selector de pseudo-clase ':root' en CSS?

Se utiliza para seleccionar el elemento raíz del documento.Se utiliza para seleccionar todos los elementos de un documento.Se utiliza para establecer propiedades globales que se pueden usar en todos los elementos del documento.Se utiliza para seleccionar el primer elemento hijo de un documento.

Clase Pseudo CSS :root ​

Versión ​

Sintaxis ​

Ejemplo de la pseudo-clase :root: ​

Practice ​

Clase Pseudo CSS :root

Versión

Sintaxis

Ejemplo de la pseudo-clase :root:

Practice