最常见原因是bootstrap 5默认对标签设置了text-decoration: underline（含!important），而text-decoration-underline工具类无!important且优先级更低，无法覆盖；该类仅适用于非元素，且不支持颜色、样式等扩展。
为什么加了 text-decoration-underline 还没下划线
最常见原因是：Bootstrap 5 默认对所有 <a></a> 标签强制设置了 text-decoration: underline（在 _reboot.scss 中），而工具类 text-decoration-underline 只是添加同名声明，不带 !important，优先级被覆盖。
更关键的是：这个默认规则在压缩版 CDN CSS（如 bootstrap.min.css）里往往带 !important，导致你的工具类完全无效。
- 直接给
<a></a>加text-decoration-none是清除行为，不是开启下划线——它只管“关”，不管“开” -
text-decoration-underline对非<a></a>元素（比如<span></span>、<p></p>）通常能生效，但颜色是currentColor，不是主题色 - Bootstrap 5.3+ 新增了
link-underline类，这才是专为链接设计的“开启下划线”方案；旧版本没有该类，硬加无效
text-decoration-none 到底清除了什么
它只清除 text-decoration-line 值（即 underline、line-through、overline），不影响其他文本装饰属性，比如 text-shadow 或 letter-spacing。
注意两点：
- 它会清除从父元素继承来的下划线，比如父级有
text-decoration-underline，子级加text-decoration-none就能断掉，不需额外重置 - 它不自动作用于子元素：如果父级加了
text-decoration-underline，里面嵌个<span></span>，这个<span></span>不会自带下划线；想让它也有，得单独加类 - 对
<a></a>使用时，它同时清除:hover和:focus状态下的下划线（Bootstrap 5.3+ 内置处理），但旧版本需手动补a:hover { text-decoration: none; }
响应式下划线怎么实现
Bootstrap 5 的文本装饰类不支持响应式前缀，没有 text-decoration-underline-md 这种写法。所谓“桌面显示、移动端隐藏”，只能手写媒体查询。
典型做法：
- 用内联
style快速验证：<p class="text-decoration-underline" style="text-decoration: underline; @media (max-width: 768px) { text-decoration: none; }"></p>—— 但不推荐长期用 - 在自定义 CSS 中写：
@media (min-width: 768px) { .desktop-underline { text-decoration: underline; } }，然后在 HTML 里混用class="desktop-underline" - 避免用
text-decoration-none d-md-inline这类组合：前者强制清除，后者只控制display，两者无关，不会“恢复”下划线
想改下划线颜色或样式怎么办
Bootstrap 5 的工具类完全不支持 text-decoration-color、text-decoration-style 或 text-decoration-thickness。这三个类只是快捷开关，底层就是 text-decoration-line: underline 这一条声明。
真要定制，必须手写 CSS：
- 单个元素：加自定义 class，比如
class="custom-underline"，再配.custom-underline { text-decoration: underline; text-decoration-color: #0d6efd; text-decoration-style: wavy; text-decoration-thickness: 2px; } - 全局统一：重设 CSS Custom Property（仅限 Bootstrap 5.3+）：
:root { --bs-link-decoration: underline; --bs-link-decoration-color: #dc3545; }，但注意这只影响链接相关变量，不作用于工具类 - 别试图用
!important覆盖工具类：因为工具类本身没声明颜色或样式，你覆盖的其实是浏览器默认值，不稳定
复杂点在于：这些高级装饰属性在部分老浏览器（如 IE、旧版 Safari）支持有限，上线前务必查 caniuse。如果项目需兼容到 iOS 14 以下，最好降级为纯色实线下划线。
