<style>

概要

HTML的<style>元素包含了文档的样式化信息或者文档的一部分。指定的样式化星系包含的该元素内，通常是CSS的格式。

• 内容类别元数据内容, 如果指定了scoped属性：流内容。
• 允许的内容匹配type属性指定的语言的样式信息。
• 标签忽略 None, both the starting and ending tag are mandatory.
• 允许的父元素 ...
• DOM接口 HTMLStyleElement

属性

该元素包含所有全局属性。

type

该属性以MIME类型（不应该指定字符集）定义样式语言。如果该属性为指定，则默认为‘text/css'。

media

指定哪个媒体应该应用该样式，请查看 https://dev.w3.org/csswg/css3-mediaqueries.

scoped

如果该属性存在，则样式应用于其父元素；如果不存在，则应用于整个文档。

title

指定可选的样式表。

disabled

If set, disables (does not apply) the style rules to the Document that are specified within the element.如果指定该属性，关闭（不应用）样式规则到文档中的元素。

示例

一个简单的样式表

<style type="text/css">
body {
  color:red;
}
</style> 

一个scoped的样式表

<article>
  <div>The scoped attribute allows for you to include style elements mid-document.
   Inside rules only apply to the parent element.</div>
  <p>This text should be black. If it is red your browser does not support the scoped attribute.</p>
  <section>
    <style scoped>
      p { color: red; }
    </style>
    <p>This should be red.</p>
  </section>
</article>

现场示例

规范

浏览器兼容性

[1] 在Chrome 20+到34，同过在chrome://flags中打开“Enable <style scoped>“或者”实验性WebKit特性”来支持。在Chrome 35+由于代码完成而移除了这些flags。
[2] Gecko在20及更高版本实现：scope 伪类，但是layout.css.scope-pseudo.enable必须被设置为true。这仅是在每夜和Aurora测试版本上是默认的。

查看更多

• <link>元素允许使用外部的样式表。