主页 / coding / 问题 / 79559681
Accepted
einpoklum
Asked: 2025-04-07 18:54:26 +0800 CST

在 CSS 中，如何使用属性有条件地设置 :root 伪元素的样式？

  • 772

我有一些 JS 代码需要对整个渲染好的 HTML 文档进行样式设置。我目前使用的是以下 CSS：

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

加上在文档元素上设置一个属性：

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

但是——出于一些原因（这些原因应该不相关），我希望CSS能够设置:root伪元素的样式，而不是<html>元素本身。我的问题是：如何:root根据属性值进行选择？我无法设置属性本身:root，因为它不是DOM的一部分。

css

1 个回答

  1. Best Answer

    在 HTML 文档中，CSS:root选择器代表<html>标签，它是 HTML 文档的根（MDN）。

    您在 HTML 元素上设置的任何属性也可用于选择:root元素：

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

</html>

    • 0

相关问题