HTML <style> 元素

HTML <style> 元素包含文档或文档的一部分的样式信息。默认情况下，写入该元素的样式内容应该是CSS。

在 HTML 文档中使用 <style> 元素：

<html>
<head>
  <style type="text/css">
    h1 {
      color: red;
    }

    p {
      color: blue;
    }
  </style>
</head>
<body>
  <h1>这是一个标题</h1>
  <p>这是一个段落。</p>
</body>
</html>

尝试一下 »

截图

在 HTML 文档中使用 <style> 元素

特性

内容类别 元数据内容，如果 scoped 属性存在：流式内容。
允许的内容 符合 type 属性（即 text/css）的内容。
标签省略 不允许，开始标签和结束标签都不能省略。
允许的父元素 任何接受元数据内容的元素。
允许的 ARIA 角色 无
DOM 接口 HTMLStyleElement

属性

该元素包含了全局属性。

type

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

media

该属性定义了样式应用在哪种媒体。它的值是定义在媒体查询中，如果未指定，则默认为 all。

title

指定替代样式表集。

scoped

指定样式仅适用于该元素的父元素和子元素。

事件属性

<style> 元素支持 HTML 的事件属性。

使用说明

在 <style> 元素中，您可以规定在浏览器中如何呈现 HTML 文档。

每个 HTML 文档能包含多个 <style> 标签。

如需链接外部样式表，请使用 <link> 标签。

如需学习更多有关样式表的知识，请阅读我们的 CSS 教程。

更多实例

一个简单的样式表

<html>
<head>
  <style type="text/css">
  body {
    color:red;
  }
</style> 
</head>
<body>
  <p>这是一个段落。</p>
</body>
</html>

尝试一下 »

截图

一个简单的样式表

规范

规范 状态 备注
HTML Living Standard
style 的定义		 现行的标准 -
HTML5
style 的定义		 推荐 从 HTML 4.01 Specification 之后没有变化。
HTML 4.01 Specification
style 的定义		 推荐 -

桌面浏览器兼容性

特性 Chrome Edge Firefox Internet Explorer Opera Safari
基础支持 1.0 支持 1.0 3.0 3.5 1.0
type 1.0 支持 1.0 3.0 3.5 1.0
media 1.0 支持 1.0 3.0 3.5 1.0
title 1.0 支持 1.0 3.0 3.5 1.0
scoped 19.0 — 35.02 不支持 21.0 不支持 不支持 不支持

移动浏览器兼容性

特性 Android Chrome for Android Edge mobile Firefox for Android IE mobile Opera Android iOS Safari
基础支持 1.0 1.0 支持 1.0 9.01 6.0 1.0
type 1.0 1.0 支持 1.0 9.01 6.0 1.0
media 1.0 1.0 支持 1.0 9.01 6.0 1.0
title 1.0 1.0 支持 1.0 9.01 6.0 1.0
scoped 不支持 不支持 不支持 21.0 不支持 不支持 不支持

1. 移动版 Internet Explorer（以前品牌名为 IE Phone - 版本低于 8）也是支持的。

2. 从版本 19.0 开始到版本 35.0 (不包括)：该特性由 Enable <style scoped> 首选项控制（需要设置为 true）。要更改 Chrome 中的首选项，请访问 chrome://flags。

相关链接