u标签不是下划线的语义化选择，而是专用于标记拼写错误、专有名词等非标准文本；必须配合CSS显式定义样式，禁用默认下划线以避免与链接混淆、保障可访问性。
u 标签不是下划线的语义化选择，别用它标重点
HTML5 明确将 <u> 重定义为“非标准文本”（如拼写错误、专有名词、翻译标注等），**不是**用来替代 CSS 的 text-decoration: underline。浏览器默认样式虽显示下划线，但语义错位会导致可访问性工具误读、SEO 混淆，甚至被 Lighthouse 标记为语义问题。
常见错误现象：用 <u>重要信息</u> 实现强调效果，结果屏幕阅读器念成“underline 开始”，用户完全不知所云。
- 真正该用
<u>的场景：比如展示一段带拼写纠错的文本<u class="spelling-error">recieve</u> - 想加下划线强调？直接用
span+ CSS：<span style="text-decoration: underline">关键参数</span> - 需要语义化强调？优先选
<strong>或<em>，再用 CSS 控制视觉表现
s 标签仅表示内容被弃用，不等于“删掉就完事”
<s> 的语义是“不再准确或不再相关”，比如价格变更前的旧价、已停用的功能名。它**不表示编辑过程中的删除动作**（那是 <del> 的职责）。混用会导致语义污染——例如用 <s>¥299</s> ¥199 是合理；但用 <s>旧版 API</s> 而不说明当前状态，会让人困惑是否已彻底下线。
- 正确场景：
<s>支持 IE8</s>（明确该能力已被废弃） - 错误场景：
<s>用户名</s>用于表单校验失败提示（应改用<del>或纯 CSS） - 与
<del>的关键区别：<s>无时间属性，<del datetime="2024-03-15">才体现删除发生时间
下划线/删除线的视觉控制必须靠 CSS，HTML 标签只管语义
浏览器对 <u> 和 <s> 的默认样式（如下划线位置、删除线粗细）不可靠，且无法跨浏览器统一。想精确控制间距、颜色或动画，必须用 CSS。
立即学习“前端免费学习笔记（深入）”；
- 调整下划线距离文字：用
text-underline-offset（注意 Safari 15.4+ 才支持，旧版需text-decoration-skip-ink: none配合 - 自定义删除线颜色：
text-decoration-color: #ff6b6b，而非依赖标签默认灰 - 禁用默认下划线避免干扰：
u { text-decoration: none; }，再按需在子元素上显式添加
真实项目中更推荐组合方案：语义标签 + CSS 类名
直接裸用 <u> 或 <s> 很少能覆盖需求。多数情况是先确定语义意图，再用最小化 HTML + 可维护 CSS 解决。
- 要标记“待审核术语”？写
<span class="term-draft">量子纠缠</span>，CSS 定义.term-draft { text-decoration: underline wavy #ff9a00; } - 要表示“临时屏蔽文案”？用
<span class="masked">此处广告</span>+text-decoration: line-through red - 若真需语义化删除（如版本对比），用
<del datetime="2024-06-01">removeUser()</del>，再用 CSS 调整样式
容易被忽略的是：当多个装饰线叠加（如下划线+删除线），CSS 的 text-decoration-line 必须显式声明组合值，比如 text-decoration-line: underline line-through，否则后声明的会覆盖前者。
