Question

我正在使用CMS，显然它有一个错误，不允许我将任何内容添加到博客帖子的<head>。它将所有内容插入到主体中，在大多数情况下，它可以正常工作，但是在这样的代码实例中：

<style type="text/css">
 .slideshow img { display: none }
 .slideshow img.first { display: block }
</style>

如果将所有类型的代码放在所有主流浏览器的<body>标记内，它们会运行吗？（IE8 +，Firefox，Chrome和Safari。）通常情况下，它始终位于页面的<head>中。

注意：这似乎适用于FF 15，但我不确定其他浏览器。

Answer 1

在正文中使用样式标记是无效的代码。

每个浏览器都会尝试以有意义的方式使用无效代码。有些浏览器似乎仍然使用样式规则，但您不能依赖于所有当前和未来浏览器的行为。另一种非常有意义的行为是忽略无效的样式标记。

请注意，即使在同一浏览器中，行为也会有所不同，具体取决于页面是以标准合规模式还是以怪异模式呈现。在标准合规模式（这是首选模式）中，浏览器往往更严格并忽略无效代码，而不是试图猜测作者对代码的意图。

在HTML5中，您可以在body元素中使用样式标记。在任何不了解HTML5的旧版浏览器中，或者如果您没有HTML5文档类型，它仍然是无效的代码。

Answer 2

Javascript是另一个想法，因为<script>元素可能出现在正文中。当然，这取决于用户允许使用Javascript。

我没有看到另一种选择（当然除了style属性之外）。

或者只是在体内使用它，即使这会让@Cole喊出来？当script元素为introduced as a placeholder in HTML 3.2时，规范说＆＃34;用户代理应该隐藏这些元素的内容。＆＃34;因此，至少有一些希望所有浏览器都会隐藏它（即使它们不能解释为风格）。

Answer 3

如果您可以修改CMS加载的CSS文件（即主题类型样式表），则将该代码放在CSS文件的底部，并使用注释表示自定义样式（供将来参考）或使用一个CSS Import Rule用你的主题搭载你的CSS。

Answer 4

是的，即使在style内，浏览器也会识别并应用body元素。它们甚至可以“向后”应用它，即您可以设置出现在style元素之前的元素。

很容易检查出来，但更难以预测未来。你并不孤单（拥有这样的限制是相当普遍的 - 不是真正的错误，而是CMS中的故意限制），并且有很多网络内容必须使用这样的功能。因此，浏览器不太可能停止支持它，尽管他们可能会想到有一天会以“标准模式”拒绝它。

HTML5草案目前不建议将其标准化。相反，他们想要在style中允许body，但仅在使用scoped属性时，其含义是style元素的效果仅限于封闭的。这很奇怪，但实际上与style元素没有 scoped属性在body中具有全局效应的做法实际上是不相容的。

当然，如果有合理的做法，你不应该使用这个功能。

Answer 5

答案是不应该在任何主浏览器中呈现它。

正如几条评论指出的那样，你不应该这样做;你将违反标准，这意味着结果是不确定的 - 即它应该有效，但你无法确定。

我很欣赏在某些情况下（即使用设计不佳的CMS时），它可能是唯一可用的选项，但一般来说这是一件坏事。

如果你真的需要这样做，并且你担心它，一个解决方案是将内容放入HTML注释中：

<style type="text/css">
<!--
 .slideshow img { display: none }
 .slideshow img.first { display: block }
-->
</style>

即使是不喜欢身体中有<style>的浏览器也应该阻止它出现。

另一种选择是将其放入外部样式表文件中，并使用<style>标记包含它。这应该仍然有效，但由于该元素没有任何直接内容，因此它不会显示任何不良行为的浏览器。

希望有所帮助。