Bootstrap文字颜色工具类直接用text-primary等类名即可设置color属性，仅影响文字颜色；常见错误是混淆text-与bg-功能，如text-danger只变文字为红而非背景。
Bootstrap 颜色工具类怎么设文字颜色
直接用 text-primary、text-success 这类类名就行，它们作用于 color 属性。注意：这些类不会影响背景或边框，只管文字。
常见错误是以为 text-danger 会让整块区域变红背景——其实它只让字变红；要配背景得另加 bg-danger。
-
text-muted是灰度文字（color: #6c757d），常用于辅助说明，不是“禁用”语义 -
text-white在深色背景上才看得清，单独用在白底上会“消失” - Bootstrap 5 起移除了
text-gray-dark等旧类，统一为text-black-50/text-white-50控制透明度 - 自定义主题色时，别直接覆盖
$theme-colors后忘了重新编译 CSS，否则工具类不生效
怎么用 bg-* 类设置背景色
bg-primary 这类类名控制的是 background-color，和文字颜色类完全独立。两者可以同时用，比如 text-white bg-primary 做高对比按钮文字。
容易踩的坑是：某些浅色背景（如 bg-light）在白色容器里根本看不出变化，调试时建议临时加个 border 辅助观察。
-
bg-transparent是合法类名，能清除默认背景，比写style="background:transparent"更干净 -
bg-gradient必须配合具体色值类（如bg-gradient-primary）才生效，单独用无效 - 响应式背景色暂不支持（比如
bg-md-primary不存在），需要自己写媒体查询
为什么 text-* 在 button 上没反应
因为 Bootstrap 的 button 默认有内建文字颜色样式（比如 .btn-primary 自带 color: #fff），会覆盖 text-* 的优先级。
解决方法只有两个：要么放弃用工具类，直接改 button 的修饰类（如换用 btn-outline-primary）；要么加 !important（不推荐）或提高选择器权重（比如套一层 div 再加 text-danger）。
- 表单控件（
input、select）也有同样问题，text-类基本无效 -
a标签默认有:hover和:visited颜色，text-info只影响常态，悬停仍走链接默认逻辑 - 如果只是想临时强调某段文字，用
span包裹再加text-warning最稳妥
如何扩展或修改默认颜色工具类
Bootstrap 的颜色工具类由 SCSS 变量驱动，改 $theme-colors 映射表就能批量生成新类。但注意：新增颜色名（如 purple）后，必须确保对应变量（$purple）已定义，否则编译会报错。
不重新编译的话，动态加类也没用——工具类是构建时生成的静态 CSS，不是运行时 JS 注入。
- 想加一个
text-brand，就得在 SCSS 中写：$theme-colors: map-merge($theme-colors, ("brand": #3498db)); - 删掉某个色系（比如不用
light）？删变量即可，对应bg-light等类就不会产出 - 若项目用 CDN 引入 CSS，就无法扩展——只能手写 CSS 覆盖，或改用 Bootstrap 官方提供的定制下载页生成新 CSS
实际用的时候，先确认你用的是 Bootstrap 4 还是 5，两者的颜色变量名和工具类命名略有差异；另外，别指望工具类能覆盖所有设计需求，该写 CSS 的地方还得写。
