Início / coding / Perguntas / 79559681
Accepted
einpoklum
Asked: 2025-04-07 18:54:26 +0800 CST

Em CSS, como estilizo condicionalmente o pseudoelemento :root usando atributos?

  • 772

Tenho um código JavaScript que precisa ser usado para estilizar todo um documento HTML renderizado. O que uso atualmente é o seguinte CSS:

[myattr="true"]  { direction: rtl; }
[myattr="false"]  { direction: ltr; }

além de definir um atributo no elemento do documento:

doc.documentElement.setAttribute('myattr', true);

Mas, por motivos (que não deveriam ser relevantes), quero que o CSS estilize o :rootpseudoelemento, não o <html>elemento. Minha pergunta é: como posso selecionar :rootcom base no valor do atributo? Não é como se eu pudesse definir o atributo em :rootsi mesmo, já que ele não faz parte do DOM.

css

1 respostas

  1. Best Answer

    Em um documento HTML, o :rootseletor CSS representa a <html>tag, que é a raiz do documento HTML ( MDN ).

    Qualquer atributo que você definir no elemento HTML :roottambém pode ser usado para selecionar o elemento:

    :root[myattr="true"] { 
  background: red;
}
    <html myattr="true">

</html>

    • 0

relate perguntas