.text-muted 在 bootstrap 5 中仍完全可用，但官方预告将在 v6 中由语义更精准的 .text-body-secondary 替代；它绑定 $gray-600 变量而非简单灰色，专用于标识次要、非操作性内容，误用会导致深色模式对比度不足或可访问性问题。
.text-muted 在 Bootstrap 5 中仍完全可用，但官方已明确它将在 v6 中被 .text-body-secondary 替代——这不是废弃警告，而是提前对语义演进的提示。当前项目中无需替换，但新项目或长期维护项目应开始关注迁移路径。
为什么 .text-muted 不是“灰色文本”那么简单
很多人以为 .text-muted 就是设了个 color: #6c757d，其实它绑定的是 Sass 变量 $gray-600，且不随父元素 opacity 变化；它和 .text-body 不同——后者继承当前 color 值，不是固定色值。误用 .text-muted 当“弱化任意文字”时，容易在深色模式或自定义主题下失去对比度。
-
.text-muted是语义类：表示“次要、非操作性、辅助性内容”，比如表单帮助文本、时间戳、标签旁的说明 - 它不等于
.text-black-50或opacity: 0.5：前者是硬编码透明度，后者是视觉降权，语义和可访问性完全不同 - 若你只是想让一段文字“看起来淡一点”，而无辅助性含义，优先考虑
.text-black-50（黑字半透）或.text-white-50（白字半透）
.text-body-secondary 是什么，现在能用吗
.text-body-secondary 是 Bootstrap 6 的新增类，用于替代 .text-muted 的语义定位，强调“正文层级中的次级文本”，更契合设计系统分层逻辑。它目前（v5.3.x）尚未进入 Bootstrap 5 的正式 CSS 输出，强行写入会无效。
- Bootstrap 5 官方文档与源码中查不到
.text-body-secondary类名 - 若你在项目里看到它生效，大概率是手动引入了 v6 的 CSS 片段，或用了第三方插件覆盖
- 想提前适配？可在自定义 Sass 中定义：
.text-body-secondary { color: var(--bs-body-color); opacity: .75; }，但注意这不等价于 v6 的完整实现（v6 还关联--bs-body-secondary-colorCSS 变量）
实际项目中该怎么选：替换还是保留
除非你正在为 Bootstrap 6 做预研或搭建设计系统底座，否则没必要主动替换 .text-muted。它的行为稳定、兼容性好、屏幕阅读器支持成熟。真正要动手的地方，是检查它是否被误用。
- ✅ 正确场景：
<small class="form-text text-muted">请输入 6–20 位字母或数字</small> - ❌ 错误场景：
<p class="text-muted">© 2026 公司版权所有</p>（版权行应使用.text-secondary或语义更准的.small.text-muted组合） - ⚠️ 风险点：用
.text-muted给链接上色——它不带:hover状态，会导致悬停无变化，需额外补样式
最常被忽略的不是类名换不换，而是每个颜色类背后的语义约束。.text-muted 不是调色盘里的一个灰，它是告诉浏览器“这段文字别重点读”，也是告诉设计师“这里不该放关键操作”。换类名容易，换理解难。
