Question

我想在我的页面中定义一个CSS片段，如下所示：

<style type="text/css">
hr {color:sienna;}
p {margin-left:20px;}
</style>

我一直在读它应该在<head>元素中定义，但它在内联时似乎工作正常。有人可以确认这是否合适？

Answer 1

对于HTML 4，规范说：

STYLE元素允许作者将样式表规则放在文档的头部。 HTML允许文档的HEAD部分中的任意数量的STYLE元素。

他们对“head文件”的说明，而不仅仅是“文件”强烈暗示其他地方不合适。

但是，对于HTML 5，这是放宽的，style元素可以放在文档本身中：

style元素允许作者在其文档中嵌入样式信息。样式元素是样式处理模型的几个输入之一。该元素不代表用户的内容。

Answer 2

大多数浏览器将它放在页面的任何位置，但请注意，它只会从那时开始生效。另外，如果你没有将它放在head元素中，它就不是有效的HTML。

Answer 3

不确定。

虽然某些浏览器可能（错误地）在不在HEAD元素中时关心它，但这不是您应该依赖的行为，因为它与HTML标准相反，并且对于任何给定的浏览器将来可能会或可能不会起作用

编辑更新：在HTML 5中，样式元素的范围可以仅适用于子树，在这种情况下，它们不需要位于head元素中。

然而，他们仍然需要在他们适用的任何其他内容面前，所以同样的原则适用。

Answer 4

除非您使用HTML5和scoped属性，否则它不是严格有效的。

虽然我所知道的所有浏览器都会在文档中的任何位置接受标记。