javascript - 是否可以在 CSS 的类中设置一个类？

Question

我为我的网站制作了一个深色主题，它的工作原理是，当单击按钮时，javascript 代码会自动将一个DARK类添加到body标签中。如何使H1标签在正文有类时为白色，而在标签上没有类DARK时为灰色？DARKbody

score 0 · Accepted Answer

创建 2 个样式表，1 个默认样式表，另一个为深色样式表。然后查看使用 Javascript 在多个 CSS 文件之间切换以即时更改样式表。您还需要将用户选择存储在 cookie 中，然后检索该值并使用相同的代码来更改样式表（否则用户需要为他们访问的每个页面选择选项）。

score 0 · Accepted Answer

尽管您的问题措辞不佳，但我想我了解您要做什么。

如果我理解正确，如果标签添加了类，则您希望H1标签具有白色，如果没有类，则希望标签具有灰色。BODYdarkdark

使用 CSS 很容易实现这一点，所以我将给出一个示例来帮助您理解这一点。

在您的 CSS 文件（如果您使用单独的样式表文件）或style标签中，添加body > h1如下样式：

body > h1{
  color: gray;
}

当站点加载时，上述样式将默认H1标记颜色更改为灰色。当您以编程方式将dark类添加到站点的主体标签时，要让脚趾颜色自动更改，请添加以下样式（最好在上述样式的下方）：

body.dark > h1{
  color: white;
}

H1如果标签上有深色类，上面的样式会将标签颜色更改为白色BODY。

总而言之，您的网站样式应如下所示以满足您的特定要求：

body > h1{
  color: gray;
}

body.dark > h1{
  color: white;
}

你真的应该更多地学习 CSS，因为使用 CSS 实现这一点并不难。

2 回答 2