blocks|key|145180|text|大多数浏览器将它放在页面中的任何位置，但请注意，它只在该点之后生效。而且，如果不把它放在head元素中，它就不是有效的HTML。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|145181|此外，it's+considered+best+practise+to+put+it+in+the+head+element还可以缩短页面渲染时间。|offset|length|145182|entityMap|0|LINK|mutability|MUTABLE|url|http://developer.yahoo.com/performance/rules.html#css_top^0|0|3|1N|0|0^^$0|@$1|2|3|4|5|6|7|N|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|O|8|@]|9|@$D|P|E|Q|1|R]]|A|$]]|$1|F|3|-4|5|6|7|S|8|@]|9|@]|A|$]]]|G|$H|$5|I|J|K|A|$L|M]]]]

Most browsers put it anywhere in the page, but just be aware that it only takes effect from that point onwards. Also, it's not valid HTML if you don't put it in the head element.

Also, <a href="http://developer.yahoo.com/performance/rules.html#css_top" rel="nofollow">it's considered best practise to put it in the head element</a> as it improves page render times.

blocks|key|3726602|text|It+is++OK。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3726603|虽然一些浏览器可能(错误地)在不在HEAD元素中时关心它，但这不是您应该依赖的行为，因为它与HTML标准背道而驰，将来可能会也可能不会在任何给定的浏览器上工作。|3726604|编辑：更新:在HTML5中，样式元素的作用域可以只应用于子树，在这种情况下，它们不需要在head元素中。|offset|length|style|BOLD|3726605|然而，他们仍然需要在他们应用的任何其他内容之前，所以同样的原则也适用。|3726606|entityMap^0|0|0|0|3|0|0^^$0|@$1|2|3|4|5|6|7|N|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|O|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|P|8|@$F|Q|G|R|H|I]]|9|@]|A|$]]|$1|J|3|K|5|6|7|S|8|@]|9|@]|A|$]]|$1|L|3|-4|5|6|7|T|8|@]|9|@]|A|$]]]|M|$]]

It is not OK.

While some browsers might (mistakenly) care about it when not in the HEAD element, this is not behavior you should rely on, as it is counter to the HTML standard and may or may not work in the future for any given browser.

Edit: Update: In HTML 5, style elements can be scoped to only apply to a subtree, in which case they don't need to be in the head element.

They still, however, need to be in front of any other content they apply to, so the same principle applies.

blocks|key|3441068|text|对于HTML4，规范说：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3441069|3441070|元素允许作者将样式规则放在文档头中。HTML允许在文档的标题部分使用任意数量的样式元素。|blockquote|3441071|3441072|3441073|Reference:+http://www.w3.org/TR/html4/present/styles.html#h-14.2.3.|offset|length|3441074|他们对"head+of+the+document“的规范，而不是简单的”document"，强烈地表明在其他地方是不合适的。|style|CODE|3441075|然而，对于HTML5，这是宽松的，style元素可以放在文档本身中：|3441076|3441077|元素允许作者在他们的文档中嵌入样式信息。style元素是样式处理模型的几个输入之一。元素不代表用户的内容。|3441078|3441079|3441080|Reference:+http://www.w3.org/TR/html5/semantics.html#the-style-element.|3441081|entityMap|0|LINK|mutability|MUTABLE|url|http://www.w3.org/TR/html4/present/styles.html#h-14.2.3|1|2|http://www.w3.org/TR/html5/semantics.html#the-style-element|3^0|0|0|0|0|0|0|B|0|B|1J|1|0|4|4|0|H|5|0|0|0|0|0|0|B|2|B|1N|3|0^^$0|@$1|2|3|4|5|6|7|1A|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|1B|8|@]|9|@]|A|$]]|$1|C|3|D|5|E|7|1C|8|@]|9|@]|A|$]]|$1|F|3|-4|5|6|7|1D|8|@]|9|@]|A|$]]|$1|G|3|-4|5|6|7|1E|8|@]|9|@]|A|$]]|$1|H|3|I|5|6|7|1F|8|@]|9|@$J|1G|K|1H|1|1I]|$J|1J|K|1K|1|1L]]|A|$]]|$1|L|3|M|5|6|7|1M|8|@$J|1N|K|1O|N|O]]|9|@]|A|$]]|$1|P|3|Q|5|6|7|1P|8|@$J|1Q|K|1R|N|O]]|9|@]|A|$]]|$1|R|3|-4|5|6|7|1S|8|@]|9|@]|A|$]]|$1|S|3|T|5|E|7|1T|8|@]|9|@]|A|$]]|$1|U|3|-4|5|6|7|1U|8|@]|9|@]|A|$]]|$1|V|3|-4|5|6|7|1V|8|@]|9|@]|A|$]]|$1|W|3|X|5|6|7|1W|8|@]|9|@$J|1X|K|1Y|1|1Z]|$J|20|K|21|1|22]]|A|$]]|$1|Y|3|-4|5|6|7|23|8|@]|9|@]|A|$]]]|Z|$10|$5|11|12|13|A|$14|15]]|16|$5|11|12|13|A|$14|15]]|17|$5|11|12|13|A|$14|18]]|19|$5|11|12|13|A|$14|18]]]]

For HTML 4 the spec says:

<blockquote>
 The STYLE element allows authors to put style sheet rules in the head of the document. HTML permits any number of STYLE elements in the HEAD section of a document.
</blockquote>

<a href="http://www.w3.org/TR/html4/present/styles.html#h-14.2.3">Reference: <a href="http://www.w3.org/TR/html4/present/styles.html#h-14.2.3">http://www.w3.org/TR/html4/present/styles.html#h-14.2.3</a></a>.

Their specification of "<code>head</code> of the document", rather than simply 'document' strongly suggests that elsewhere is inappropriate.

For HTML 5, however, this is relaxed and the <code>style</code> element can be placed within the document itself:

<blockquote>
 The style element allows authors to embed style information in their documents. The style element is one of several inputs to the styling processing model. The element does not represent content for the user.
</blockquote>

<a href="http://www.w3.org/TR/html5/semantics.html#the-style-element">Reference: <a href="http://www.w3.org/TR/html5/semantics.html#the-style-element">http://www.w3.org/TR/html5/semantics.html#the-style-element</a></a>.

blocks|key|1826441|text|除非使用HTML5和作用域属性，否则它不是严格有效的。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1826442|http://www.w3schools.com/html5/tag_style.asp|offset|length|1826443|尽管我所知道的所有浏览器都会接受文档中任何位置的标记。|1826444|entityMap|0|LINK|mutability|MUTABLE|url^0|0|0|18|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|P|8|@]|9|@$D|Q|E|R|1|S]]|A|$]]|$1|F|3|G|5|6|7|T|8|@]|9|@]|A|$]]|$1|H|3|-4|5|6|7|U|8|@]|9|@]|A|$]]]|I|$J|$5|K|L|M|A|$N|C]]]]

It is not strictly valid unless you are using HTML5 and the scoped attribute. 

<a href="http://www.w3schools.com/html5/tag_style.asp" rel="nofollow">http://www.w3schools.com/html5/tag_style.asp</a>

Although all browsers that I know of will accept the tag anywhere in the document.

I would like to define a snippet of CSS in my page like this:

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

I keep reading that it should be defined within the <code>&lt;head&gt;</code> element, but it seems to work fine when inline. Can someone confirm if this is okay?

Does CSS have to be defined within <head> tags?

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

我想在我的页面中定义一个CSS片段，如下所示：<style type="text/css">hr {color:sienna;}p {margin-left:20px;}</style>我一直在读到它应该在<head>元素中定义，但它在内联时似乎工作得很好。

问CSS必须在<head>标签中定义吗？
EN

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问CSS必须在<head>标签中定义吗？EN