标签语义是标示内容重要性而非单纯加粗，用于错误提示、法律条款等不可忽略信息； 表达语气强调，二者嵌套需分层合理；纯样式需求应使用 或 。
strong 标签不是“加粗用的”，而是标记内容重要性
很多人看到 <strong></strong> 就下意识当成 <b></b> 用，只为了视觉加粗。这是错的——<strong></strong> 的语义是“这部分信息不能忽略”，比如错误提示、法律条款、安全警告。浏览器默认加粗只是呈现方式，屏幕阅读器会明确告知用户“此内容重要”，并可能插入停顿或加重音效。
常见错误现象：<strong>点击此处下载</strong> —— “点击此处”本身不重要，重要的是“下载”这个动作或文件本身；更合理的写法是 <strong>立即下载 v2.4.1 安装包</strong>，把真正关键的信息包裹进去。
使用场景包括：
- 表单必填项标识：
邮箱地址 <strong>(必填)</strong> - 安全提示：
<strong>此操作不可撤销</strong>，确认后将永久删除所有备份 - 责任声明：
用户须自行承担<code><strong>全部风险</strong>
em 和 strong 混合使用的实际逻辑
混合不是为了“又斜又粗”，而是分层表达：外层是内容重要性，内层是语气强调。比如一句法律提示中，既要突出“必须”这个义务（<strong></strong>），又要体现“立即”这个紧迫感（<em></em>）。
正确示例：<p>您<strong>必须</strong>在<strong><em>24 小时内</em></strong>完成实名认证，否则账户将被冻结。</p>
这里嵌套的合理性在于：<strong></strong> 包裹“24 小时内”，表示这是整个句子中不可忽略的时间约束；而 <em></em> 在其内部强调“24 小时内”的紧迫语气，不影响整体重要性层级。
容易踩的坑：
- 把
<em></em>套在<strong></strong>外面，比如<em><strong>警告</strong></em>—— 语义冲突：既说“语气强调”，又说“内容重要”，辅助技术可能无法准确传达意图 - 纯为样式叠加而嵌套，如
<strong><em>价格</em></strong>，却不考虑是否真有双重语义需求 - 在
<strong></strong>内部用<em></em>强调一个本不该被语气强化的词，例如<strong>请勿<em>尝试</em>破解系统</strong>—— “尝试”不是语气焦点，“破解系统”才是重点，应改为<strong>请勿尝试<em>破解系统</em></strong>
为什么不能用 CSS 覆盖默认样式来混淆语义
有人觉得“反正我用 CSS 把 <strong></strong> 改成斜体、<em></em> 改成加粗，不就一样了吗？”不行。语义和样式是两件事：辅助技术（如 VoiceOver、NVDA）读取的是 HTML 标签本身的含义，不是你写的 font-weight 或 font-style。
比如你写：<strong style="font-style: italic;">密码不能为空</strong>，屏幕阅读器仍会说“这很重要”，但它看到的仍是 <strong></strong>，不会因为加了斜体就转成语气强调。
性能与兼容性影响很小，但可访问性损害是直接的：视障用户依赖标签语义做判断，搜索引擎也据此理解内容权重。错用等于主动放弃一部分用户和搜索可见性。
简而言之：样式归 CSS，语义归 HTML。改样式可以，但别靠样式反推语义。
em 和 strong 都不适用时，才考虑 i 和 b
如果一段文字只是需要斜体或加粗，但既不承载语气变化，也不代表内容重要性，那就该用 <i></i> 或 <b></b>。HTML5 明确保留它们，就是为这种纯样式场景服务。
典型例子：
-
<i>Homo sapiens</i>—— 生物学拉丁名，惯例斜体，无语气或重要性含义 -
<b>注意</b>：该功能处于实验阶段—— “注意”只是视觉引导词，不是法律/安全级重要项 - 产品名中的商标符号：
iPhone <b>16</b> Pro，数字加粗仅为品牌视觉规范
混用 <i></i>/<b></b> 和 <em></em>/<strong></strong> 的边界，本质上是在回答一个问题：“这段文字的强调，是为了让读者听出语气变化，还是为了让他们意识到信息不可跳过？”答不上来，就先别加标签。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
