:root
A pseudo-classe CSS :root se equipara à raiz de uma árvore, que por sua vez representa o documento. Aplicado ao HTML, :root representa o elemento <html> e é idêntico ao seletor html, exceto que sua especificidade é mais alta.
css
/* Seleciona o elemento raiz do documento:
<html> no caso do HTML */
:root {
background: yellow;
}
Sintaxe
:root
Exemplos
Declarando variáveis CSS globais
O:root pode ser útil para declarar uma variável CSS global:
css
:root {
--main-color: hotpink;
--pane-padding: 5px 42px;
}
Especificações
| Specification |
|---|
| Selectors Level 4 # root-pseudo |
Compatibilidade com navegadores
BCD tables only load in the browser