<style>

概要

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

属性

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

type
该属性以MIME类型（不应该指定字符集）定义样式语言。如果该属性未指定，则默认为‘text/css'。
media
指定哪个媒体应该应用该样式，请查看 http://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>

现场示例

规范

规范 状态 注释
WHATWG HTML Living Standard
style		 Living Standard 从HTML5没有改变。
HTML5
style		 Recommendation 增加scoped属性。
HTML 4.01 Specification
style		 Recommendation  

浏览器兼容性

特性 Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
基本支持 (Yes) 1.0 (1.7 or earlier) (Yes) (Yes) (Yes)
scoped 20 [1] 21.0 (21.0)[2] 未实现 未实现 未实现
特性 Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
基本支持 (Yes) 1.0 (1.7 or earlier) (Yes) (Yes) (Yes)
scoped ? 25.0 (25.0)[2] 未实现 未实现 未实现

[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>元素允许使用外部的样式表。

文档标签和贡献者