如何将 CSS 应用于 HTML 正文元素？答案

【问题标题】：How to apply CSS to HTML body element?如何将 CSS 应用于 HTML 正文元素？
【发布时间】：2016-12-16 00:57:29
【问题描述】：

我正在尝试摆脱这个：

document.body.className = "someclass";

我想在 CSS 中做到这一点。

body.someclass {
.
.
.
}

不幸的是，我无法在 Firefox、chrome 中使用它。

我在这里做错了吗？有什么方法可以将 CSS 类应用于 body？

【问题讨论】：

【解决方案1】：

你在那里做两件不同的事情。您的 JavaScript 实际上将类“someclass”分配给您的 body 元素，而您的 CSS 是 样式化 类“someclass”的 body 元素，它不会将类分配给它，那不是CSS的任务。您可以像这样在普通 (X)HTML 中执行此操作：

<body class="someclass">

【讨论】：

【解决方案2】：

部分问题在于有效的 XHTML 每个文档只能有一个 <body> 元素。一个类通常归于一个多次出现的元素（或者更确切地说，归于您想要多次应用的样式）。

因为只有一个主体，所以我从未向它添加 ID 或类。只是风格：

body {
    background-color: red;
}

如果您想重用某个类，请在选择器中使用逗号：

.coolStyle, body {
    font-weight: bold;
    color: red;
    text-decoration: blink;
}

然而，所有这些都可能毫无意义，因为任何应用于<body> 标签的东西都将被其子标签继承，除非另有明确的样式。

【讨论】：

也许他稍后会使用 JavaScript 更改类并且只是想以详细的方式提供默认值？当然，我只是在那里做出假设。
我认为重要的是要注意只有一个 body 标签，但是如果您链接到外部 css 文件，那么该文件可能会遇到需要不同样式的 body 标签的多个不同网页。如果您在标题中使用文档级 css 样式，而不是在外部 css 文件中为 body 标签添加类，这也有点实际意义。

【解决方案3】：

没有必要在 body 上开设课程，因为您的文档中只有一个 body。除非您出于某种原因想通过更改 JavaScript 类来更改正文的样式。

如果您必须在 body 上放置一个类，请这样做：

<body class="someclass">

然后访问该类并像这样修改您的 css 中的样式：

body.someclass{
  ...(style parameters goes here)
}

但是，您可以更改标签所有元素的样式，并且由于您只有一个主体，您可以简单地将其添加到 css 中：

body{
  ...(style parameters)
}

不要在 html 中添加任何内容。但是，对于重复出现的标签，确实将 class 用于将多次使用的样式，将 id 用于仅在页面上使用一次的样式。您在 html 中将 id 分配给这样的标签：

<tag id="someid">

【讨论】：