| 属性 | 属性值 | 说明 |
|---|---|---|
| ① type | MIME类型 | 指定样式信息的内容类型，层叠样式表（Cascading Style Sheet）一般总是设置为text/css |
| ② media | 媒体类型 | 指定输出的媒体(media/medium)，可能的属性值有：
|
③ 通用属性：id、title、dir、lang、xml:lang  |
||
nbsp;
同script元素一样，style元素可能也得不到老版本的浏览器的支持（当然，新版本的浏览器也可以让用户停止支持样式表），为了不至于让这些浏览器把样式信息当作普通文本显示在页面上，需要对样式信息进行注释。例如：
<style type="text/css">
<!--
h1 { color: red }
p { color: blue}
-->
</style>
<!--
h1 { color: red }
p { color: blue}
-->
</style>
使用style元素在页面中创建的是内联的样式表（目前网页中使用的样式表都是CSS，即层叠样式表:Cascading style sheet），而要链接一个外部样式表则需要使用link元素，具体如下：
- 为link元素设置href属性，属性值为指向外部样式表文件的URI
- 设置type属性，用以指明所链接的样式表的语言类型。这样可以避免浏览器下载不被支持的语言类型的样式表
- 指定样式表的类型：固定的（persistent），首选的（preferred）以及可选的（alternate）：
下面的例子中，定义了一个固定样式表，位于文件mystyle.css：
<link href="mystyle.css" rel="stylesheet" type="text/css">
加入title属性，使之成为作者有限选择的样式表：<link href="mystyle.css" title="compact" rel="stylesheet" type="text/css">
在rel属性中加入关键字"alternate"，使之成为可选样式表:<link href="mystyle.css" title="compact" rel="alternate stylesheet" type="text/css">
根据W3C的HTML 4.01规格书，也可以使用meta元素设置首选的样式表，例如设置名为"compact"的样式表为首选的样式表：
<meta http-equiv="Default-Style" content="compact">
使用meta元素(或者HTTP头)设置的首选样式表优先级大于使用link元素设置的。层叠样式表
下面的例子中设置了两个名为"compact"的可选样式表，用户选择"compact"样式时，浏览器会应用固定样式表"common.css"及"small-base.css"和"small-extras.css"；如果用户选择"big font"样式，浏览器会应用固定样式表common.css和bigfont.css：
<link rel="alternate stylesheet" title="compact" href="small-base.css" type="text/css">
<link rel="alternate stylesheet" title="compact" href="small-extras.css" type="text/css">
<link rel="alternate stylesheet" title="big print" href="bigprint.css" type="text/css">
<link rel="stylesheet" href="common.css" type="text/css">
使用style定义的内部样式表和link定义的外部样式表可以出现在同一文档中：
<link rel="alternate stylesheet" title="compact" href="small-extras.css" type="text/css">
<link rel="alternate stylesheet" title="big print" href="bigprint.css" type="text/css">
<link rel="stylesheet" href="common.css" type="text/css">
<LINK rel="stylesheet" href="corporate.css" type="text/css">
<LINK rel="stylesheet" href="techreport.css" type="text/css">
<STYLE type="text/css">
p.special { color: rgb(230, 100, 180) }
</STYLE>
使用style定义内部样式表和link定义外部样式表都可以带上media属性，以应用于不同的媒体，用户代理器应该根据媒体的不同选择适合的样式表。<LINK rel="stylesheet" href="techreport.css" type="text/css">
<STYLE type="text/css">
p.special { color: rgb(230, 100, 180) }
</STYLE>
例如，下面的例子中，"techreport.css"定义的样式将应用于所有的媒体，其他的都只适合相应的媒体：
<link rel="stylesheet" media="aural" href="corporate-aural.css" type="text/css">
<link rel="stylesheet" media="screen" href="corporate-screen.css" type="text/css">
<link rel="stylesheet" media="print" href="corporate-print.css" type="text/css">
<link rel="stylesheet" href="techreport.css" type="text/css">
<style media="screen, print" type="text/css">
p.special { color: rgb(230, 100, 180) }
</style>
<link rel="stylesheet" media="screen" href="corporate-screen.css" type="text/css">
<link rel="stylesheet" media="print" href="corporate-print.css" type="text/css">
<link rel="stylesheet" href="techreport.css" type="text/css">
<style media="screen, print" type="text/css">
p.special { color: rgb(230, 100, 180) }
</style>
运行
打印