跳到主要内容

标题与段落

h1~h6 元素如何表示标题层级？​

  • 层级: h1 最高, h6 最低, 数字表示大纲深度;
  • 渲染: 默认字号随级别递减, 具体样式交给 CSS;
<h1>Heading level 1</h1>
<h2>Heading level 2</h2>
<h3>Heading level 3</h3>
<h4>Heading level 4</h4>
<h5>Heading level 5</h5>
<h6>Heading level 6</h6>

hx 与语义元素如何配合？​

  • 规则: 结构标签用 hx 声明本区块标题, 如 section、article、header;
  • 分工: hx 决定大纲层级, 语义标签决定区块角色;
  • 组合示例见 语义元素;

p 元素如何划分正文段落？​

  • 语义: 表示一个段落;
  • 渲染: 块级标签, 每个 p 独占一行并自带段间距;
  • 与空白的关系: 源码中的换行和连续空格会被折叠, 段落边界必须由 p 表达;
  • 空白折叠规则见 HTML 语法基础;
<p>This is the first paragraph.</p>
<p>This is the second paragraph.</p>