h1-h6元素代表 html 文档各自部分的标题。
标题元素传达层次结构,每个元素都有一个独立的标题级别,由其名称中的数字定义。创作内容时,标题形成嵌套结构,它们的使用顺序应以h1最重要的开始,如有必要则向下h6。
例子
句法
1 <h1>Getting Started with Web Design</h1> 2 3 <h2>Welcome</h2> 4 5 <p>Suspendisse sit amet odio et metus feugiat scelerisque eget ac enim. Quisque vel elit dui. Phasellus dui nunc, vehicula vel hendrerit a, lobortis eget magna. </p> 6 7 <h2>The Basics</h2> 8 9 <p>Est duis laboris sunt do consectetur aute. Praesent fermentum dictum erat eget cursus. Integer neque urna, eleifend a justo ac, placerat aliquam dui.</p> 10 11 <h3>Color</h3> 12 13 <p>Nulla tempus, nulla a bibendum placerat, magna diam convallis mauris, id tincidunt quam ligula id diam. Curabitur vel elementum ipsum, ut imperdiet sem. Fusce volutpat scelerisque congue.</p> 14 15 <h4>Monochrome</h4> 16 17 <p>Integer neque urna, eleifend a justo ac, placerat aliquam dui.</p> 18 19 <h3>Typography</h3> 20 21 <p>Sint dolore labore sit in cupidatat fugiat anim. Curabitur vel malesuada erat. </p> 22 23 <h2>Should Web Designers Code?</h2> 24 25 <p>Excepteur cillum ut occaecat aliqua fugiat irure minim velit anim. Aliquam pharetra nunc nulla, et rhoncus ante pellentesque sed.</p> 26 27 <h3>Understanding the box-model</h3> 28 29 <p>Ipsum nulla duis magna amet. Excepteur ipsum ullamco irure voluptate.</p>
结果
See the Pen HTML Element: H1-H6 by Envato Tuts+ (@tutsplus) on CodePen.
文件大纲
如果我们通过HTML 大纲工具运行上面的 HTML,我们可以看到浏览器如何解释我们的标题所指示的结构:
属性
h1-h6元素支持HTML 中的全局属性。全局属性对于所有 HTML 元素都是通用的,并且可以用于所有元素(尽管它们可能对其中一些元素没有太大影响)。
内容
h1-h6元素支持短语内容。
搜索引擎优化
当流行的搜索引擎为网页编制索引时,它们会抓取它们知道如何破译的内容。赢得搜索引擎青睐的一种方法是使用适当的语义 HTML 和适当的标题结构。
使用h1-h6元素,从最重要的标题 ( h1) 开始,并根据需要逐步向下。任何附加标题的特征都是前一个标题的子集。搜索引擎可以识别这一点,并帮助您的内容在用户执行查询时更丰富或更准确地返回搜索结果。
- 句法
- 结果
- 文件大纲
- 搜索引擎优化
发表评论