标题(Heading)元素拥有六个不同的级别,<h1>
是最高级的,而 <h6>
则是最低的级别。 一个标题元素能简要描述该节的主题。标题信息可以由用户代理可以使用,例如,自动构造某个文档中的内容表(就像本文档右边浮动栏一样)。
使用要点:
- 不要为了减小标题的字体而使用低级别的标题, 而是使用 CSS
font-size
属性。 - 避免跳过某级标题:始终要从
<h1> 开始,接下来使用
<h2>
等等。 - 使用
<section>
元素的时候,为了方便起见你应该考虑着去避免重复在一个页面上使用 <h1>,<h1> 应该用来表示页面的标题,其他的标题当从 <h2> 开始。 使用 section 当时候,应当每个 section 都使用一个<h2>。
详情请参考 "Defining sections" in Using HTML sections and outlines。
内容类别 | 流内容, 标题内容,可触知的内容。 |
---|---|
允许内容 | 短语内容 |
标签省略 | 不允许,开始标签和结束标签都不能省略。 |
允许的父元素 | 任何接受流内容的元素;不要把它作为 <hgroup> 元素的子元素, 这种做法已经被废弃了。 |
DOM 接口 | HTMLHeadingElement |
属性
该元素包含所有全局特性.
align属性已废弃;不要继续使用它。
示例
所有标题
下面的代码展示了所有可用的标题级别。
<h1>一级标题</h1> <h2>二级标题</h2> <h3>三级标题</h3> <h4>四级标题</h4> <h5>五级标题</h5> <h6>六级标题</h6>
下面是这些代码的结果:
示例页面
下面的代码展示了几个具有部分内容的标题。
<h1>Heading elements</h1> <h2>Summary</h2> <p>Some text here...</p> <h2>Examples</h2> <h3>Example 1</h3> <p>Some text here...</p> <h3>Example 2</h3> <p>Some text here...</p> <h2>See also</h2> <p>Some text here...</p>
下面是代码结果展示:
规范
Specification | Status | Comment |
---|---|---|
HTML Living Standard <h1>, <h2>, <h3>, <h4>, <h5>, and <h6> |
Living Standard | |
HTML5 <h1>, <h2>, <h3>, <h4>, <h5>, and <h6> |
Recommendation | |
HTML 4.01 Specification <h1>, <h2>, <h3>, <h4>, <h5>, and <h6> |
Recommendation |
浏览器兼容性
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|
Basic support | (Yes) | 1.0 (1.7 or earlier) | (Yes) | (Yes) | (Yes) |
Feature | Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|
Basic support | (Yes) | 1.0 (1.0) | (Yes) | (Yes) | (Yes) |