HTML 文本格式化

HTML 提供了一系列标签，用于对文本进行格式化，赋予它们特殊的样式或语义含义。这些标签可以分为两类：物理标签（侧重于视觉表现）和逻辑标签（侧重于语义含义）。

在现代 Web 开发中，我们更推荐使用具有语义的逻辑标签，而将纯粹的样式控制交给 CSS。

物理标签 vs. 逻辑标签

物理标签 (样式)	逻辑标签 (语义)	描述与区别
`<b>`	`<strong>`	粗体。`<b>` (Bold) 只是让文字变粗，而 `<strong>` (Strong Importance) 强调了文本的重要性。屏幕阅读器会重读 `<strong>` 的内容。
`<i>`	`<em>`	斜体。`<i>` (Italic) 只是让文字倾斜，而 `<em>` (Emphasis) 表示强调。屏幕阅读器会以重音朗读 `<em>` 的内容。
`<u>`	`<ins>`	下划线。`<u>` (Underline) 只是添加下划线，而 `<ins>` (Inserted Text) 表示文档中插入的文本。
`<s>`	`<del>`	删除线。`<s>` (Strikethrough) 只是添加删除线，而 `<del>` (Deleted Text) 表示文档中已删除的文本。

最佳实践: 优先使用  和  等逻辑标签，因为它们同时提供了视觉样式和语义信息，对 SEO 和可访问性都更有利。

<p>这是一个普通的段落。</p>
<p><b>这是一个粗体文本。</b></p>
<p><strong>这是一个重要的文本。</strong></p>

<p><i>这是一个斜体文本。</i></p>
<p><em>这是一个需要强调的文本。</em></p>

使用  标签来高亮显示文本，就像用荧光笔做标记一样。

<p>不要忘记今天购买<mark>牛奶</mark>。</p>

 标签用于定义小一号的文本，常用于版权信息或脚注。

<p><small>版权所有 &copy; 2024</small></p>

<del> 和 <ins> 经常一起使用，以显示文档的编辑和修订历史。

<p>我最喜欢的颜色是 <del>蓝色</del> <ins>红色</ins>！</p>

浏览器通常会为 <del> 添加删除线，为 <ins> 添加下划线。

<p>水的化学式是 H<sub>2</sub>O。</p>
<p>著名的数学公式 E = mc<sup>2</sup>。</p>