语义标签应优先于样式标签：<strong>表强重要性（如价格、警告），<b>仅视觉加粗（如品牌词）；<em>表语义重音（如“真的”），<i>表特殊文本（如外文术语）；<small>用于边注/版权，<mark>用于上下文高亮，<del>须与<ins>配对表示修订。
<strong> 和 <em> 是语义正确的首选，不是为了加粗或斜体而用，而是为了表达“重要”和“强调”；<b> 和 <i> 仅改样式、无语义，现代项目中应谨慎使用。
什么时候该用 <strong> 而不是 <b>
浏览器渲染效果可能一样，但语义完全不同：<strong> 表示内容具有强重要性（比如价格、警告、操作按钮文字），会被屏幕阅读器加重语气朗读；<b> 只是视觉加粗，比如产品名、关键词、中文报刊常用标题样式——它不暗示优先级或 urgency。
- 电商页面中“¥99.9”用
<strong>，因为它是关键决策信息 - 品牌 slogan 中的 “UltraFast™” 用
<b>，纯为突出品牌词，无逻辑权重 - SEO 工具会识别
<strong>内容为高相关文本，<b>基本不参与权重计算 - 在无障碍测试中，
<b>不触发任何辅助技术行为，<strong>会改变语音语调
<em> 和 <i> 的实际分界在哪
<em> 表示语义上的重音强调，比如一句话里哪个词被读得更重；<i> 则用于非默认语调/字体的文本，如外文术语、生物种名、船名、思想流文本等——它本质是“换一种字体风格”，不是“我要强调这个”。
- “你**真的**确定要删除？”中，“真的”适合用
<em> - “《
<i>Homo sapiens</i>” 必须用<i>，这是生物学命名规范 - “点击
<i>设置</i> → <code><i>隐私</i>” 中的菜单项用<i>，表示界面中的专有名称而非强调 - 误用
<i>替代<em>会导致语音朗读失去节奏感，尤其对视障用户不友好
<small>、<mark>、<del> 这三个标签常被当成样式工具，但它们有明确语义约束
它们不是“小号字”“高亮色”“删掉就行”的快捷方式，HTML5 规范对每个都有用途定义：
立即学习“前端免费学习笔记（深入）”；
-
<small>专用于“边注、版权、法律声明”这类次要但需保留的文本，不是任意缩小字体的手段；滥用会导致可访问性问题（缩放时可能过小） -
<mark>表示“文档中与当前上下文相关的高亮部分”，比如搜索结果页中匹配的关键词；不能用于装饰性背景色 -
<del>必须配合<ins>使用才完整，表示“已被删除但仍保留在历史记录中”的内容（如合同修订稿）；单独用<del>而不提供<ins>是语义断裂 - CSS 可覆盖这些标签的默认样式，但不能抹除其语义——改样式不等于改含义
真正容易被忽略的是：所有这些标签一旦嵌套进 <p> 或 <div>，就不再只是“换个样子”，而是向整个文档结构注入了可解析的语义信号。浏览器、爬虫、读屏器都依赖这个信号做判断，而不是看你用了什么 CSS 类名。
