• 日常搜索
  • 百度一下
  • Google
  • 在线工具
  • 搜转载

HTML 元素:h1—h6

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,我们可以看到浏览器如何解释我们的标题所指示的结构:

HTML 元素:h1—h6  第1张

属性

h1-h6元素支持HTML 中的全局属性。全局属性对于所有 HTML 元素都是通用的,并且可以用于所有元素(尽管它们可能对其中一些元素没有太大影响)。

内容

h1-h6元素支持短语内容。

搜索引擎优化

当流行的搜索引擎为网页编制索引时,它们会抓取它们知道如何破译的内容。赢得搜索引擎青睐的一种方法是使用适当的语义 HTML 和适当的标题结构。

使用h1-h6元素,从最重要的标题 ( h1) 开始,并根据需要逐步向下。任何附加标题的特征都是前一个标题的子集。搜索引擎可以识别这一点,并帮助您的内容在用户执行查询时更丰富或更准确地返回搜索结果。


文章目录
  • 例子
    • 句法
    • 结果
    • 文件大纲
  • 属性
  • 内容
    • 搜索引擎优化
  • 发表评论