HTML中给文字加下划线应使用CSS的text-decoration: underline，避免使用标签；推荐通过CSS类统一管理，兼顾语义、可访问性与兼容性。
HTML 中给文字加下划线用 text-decoration
直接在元素的 style 里写 text-decoration: underline 就行，这是最常用、最可控的方式。
常见错误是误用 <u></u> 标签——它语义上表示“非文本内容的下划线”（比如拼写错误提示），现代 HTML5 已不鼓励用于纯样式目的；浏览器虽仍支持，但可访问性工具可能忽略或误读。
- 推荐写法：
<span style="text-decoration: underline">这段有下划线</span> - 如果要取消默认下划线（比如去掉链接的下划线）：
text-decoration: none - 注意：
text-decoration默认会穿过字母下降部分（如 g、y），若想避开，得配合text-underline-offset（较新属性，Chrome 87+ / Firefox 84+ 支持）
用 CSS 类统一管理比内联更稳妥
项目里反复加下划线时，硬写 style 容易漏改、难维护。抽成类名更可靠。
比如定义一个 .highlight-underline：
立即学习“前端免费学习笔记（深入）”；
DeepBI DHTML 页面生成器
下载
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
`.highlight-underline {
text-decoration: underline;
text-decoration-color: #0066cc;
text-decoration-thickness: 2px;
}`
然后复用：<strong class="highlight-underline">重点词</strong>
-
text-decoration-color控制颜色，默认继承文字色，但常需单独设（尤其深色背景上） -
text-decoration-thickness可设像素值或auto，避免粗字体下划线过细看不清 - 旧版 IE 不支持后两个属性，只认
text-decoration: underline，如有兼容要求得降级处理
遇到 text-decoration 不生效？先查这三处
下划线“消失”通常不是语法错，而是被其他规则覆盖或继承干扰。
- 父元素用了
text-decoration: none（比如全局重置了a标签），子元素不会自动继承下划线，但会继承“无下划线” - 当前元素设置了
display: inline-block或float，某些老浏览器会丢弃装饰线 - 用了
transform: scale()或font-size: 0等极端样式，可能让下划线渲染错位或不可见
别用 <u></u> 标签做样式，除非真需要语义
<u></u> 在 HTML5 中语义明确：表示旁注、拼写检查标记、专有名词等非强调用途。用它加样式等于滥用语义。
实际效果也受限：无法单独调颜色、粗细、偏移，且部分屏幕阅读器会跳过或误报为“拼写错误”。
- 正确语义用法：
<u lang="zh">张三</u>（标注人名） - 纯视觉需求，一律走
text-decoration+ CSS 类 - 如果必须用标签快速原型，至少加
role="presentation"告诉辅助技术“这只是样式”
