优先选用、、、四类语义化标签，因其在可访问性、SEO和长期维护上优于、、、；表强重要性并被屏幕阅读器加重朗读，仅视觉加粗；用于语气强调，适用于外文术语等非强调斜体；/成对表示修订，仅示过期内容，已无语义；嵌套需语义一致，避免冲突或冗余。

直接说结论：用 、、、 这四类语义化标签，比用 、、、 更稳妥，尤其在可访问性、SEO 和未来维护上。

为什么优先选 而不是

两者都让文字加粗，但浏览器渲染效果一致不代表语义等价。 表示内容有强重要性，屏幕阅读器会加重语气读出； 仅表示“要加粗显示”，无强调含义。比如价格标签写成 $299，比 $299 更利于无障碍浏览。

• 实际场景：促销文案中“限时5折”适合用 ；图标旁的纯装饰性加粗（如按钮内文字仅为视觉统一）才考虑
• 兼容性无差别，所有现代浏览器都支持
• CSS 可以覆盖默认样式，但语义一旦写错，后期无法靠样式补救

和 的使用边界在哪

表示强调语气，是内容逻辑的一部分； 仅用于非强调的斜体场景，比如外文术语、船名、生物学种名、技术术语缩写等。

• 正确：

  你必须在截止前提交，否则将失去资格

  （“必须”是强约束，“否则”是语气转折）
• 正确：

  《The Great Gatsby》由 F. Scott Fitzgerald 创作

  

  HTML Text Extract

  从HTML页面（URL、文件或标准输入）中提取主体内容文本，去除导航、页脚、广告和模板文本。可直接传递给readability_check或其他文本工具。

  下载
  → 这里用 是惯例，但更严谨应配合 lang 属性：The Great Gatsby
• 错误：立即抢购 —— 这属于营销强调，该用 或

删除线与下划线：别乱用 和

和 是配套的语义对：前者表示内容被删除但保留在文档中（如修订痕迹），后者表示新增内容；而 仅表示内容不再准确或不适用（如过期价格）， 在 HTML5 中已失去语义**，仅保留纯样式用途（且默认带下划线样式易与链接混淆）。

• 推荐写法：$199 $149 —— 含时间戳，便于程序解析变更
• 避免：$199 $149（无上下文时看不出是否已生效）
• 绝对不要用 做链接提示：它没有 href，用户无法点击；真正需要可点击文本，就用 并配 CSS 去掉默认蓝色和下划线

格式化标签嵌套时的常见坑

格式化标签可以嵌套，但顺序和层级容易出错。核心原则：语义不能冲突，且避免过度嵌套影响可读性。

• 允许：原价$99（整体强调 + 内部删除）
• 危险：仅今天有效 —— 已含更强语气，再包一层 无额外价值，反而让屏幕阅读器重复加重
• 禁止：混搭内容 —— 逻辑矛盾：既删除又新增，应只用其中一种，或改用其他表达方式（如分句说明）
• 性能无关，但可维护性差：嵌套超过两层（如 ...>）会让后续修改成本陡增

真正影响页面质量的，从来不是能不能加粗或划掉，而是加粗/划掉的理由是否经得起推敲。写完每一对标签，不妨自问一句：“如果去掉这个标签，用户或机器会误解原意吗？”——答案为“会”，才是合理使用。

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！