第四篇、格式化标签

12 阅读1分钟

基础格式化标签

标题标签

<!-- HTML 标题具有每行加粗独占一行的显示特点,
     建议每个页面仅用一次顶级标题<h1>,且整体标题层级使用不超过三个 -->

<h1>这是标题 1</h1>
<h2>这是标题 2</h2>
<h3>这是标题 3</h3>
<h4>这是标题 4</h4>
<h5>这是标题 5</h5>
<h6>这是标题 6</h6>

段落标签

<p>这一段的内容</p>

直接换行标签

第一行<br>
第二行

分割线换行标签

第一段<hr>
第二段

进阶格式化标签

加粗标签

<strong>加粗文本,推荐使用</strong>
<b>加粗文本</b>

倾斜标签

<em>倾斜文本,推荐使用</em>
<i>倾斜文本</i>

删除线标签

<del>删除线文本,推荐使用</del>
<s>删除线文本</s>

下划线标签

<ins>下划线文本,推荐使用</ins>
<u>下划线文本</u>

标标签

<sup>上标</sup>
<sub>下标</sub>

语义化标签

<!-- 1. 文本标注类 -->
<abbr title="HyperText Markup Language">HTML</abbr>  <!-- 缩写/简称 -->
<address>北京市朝阳区XX路XX号 | 联系电话:123456789</address>  <!-- 联系信息 -->
<blockquote cite="https://example.com">这是一段长引用内容,通常用于引用大段文本,会自动缩进。</blockquote>  <!-- 长引用(带来源) -->
<q>这是短引用,浏览器自动添加引号。</q>  <!-- 短引用 -->
<cite>《HTML权威指南》</cite>  <!-- 作品标题(书籍/文章/影片等) -->

<!-- 2. 代码展示类 -->
<code>const num = 123;</code>  <!-- 单行代码/代码片段 -->
<pre><code>
// 多行代码推荐嵌套pre(保留格式)
function sayHello() {
  console.log("Hello World");
}
</code></pre>
<var>x</var> + <var>y</var> = <var>z</var>  <!-- 变量/参数 -->

<time datetime="2026-03-01">2026年3月1日</time>  <!-- 时间/日期(SEO友好) -->
<mark>重点高亮文本</mark>  <!-- 标记/高亮文本 -->
<progress value="70" max="100">70%</progress>  <!-- 进度条 -->
<meter value="80" min="0" max="100">80%</meter>  <!-- 度量值(如评分/使用率) -->