改Tooltip背景透明度必须用rgba()而非opacity，否则文字和箭头一同变淡；需同时设置.tooltip-inner和.tooltip-arrow::before的rgba背景色，并确保CSS加载顺序在Bootstrap之后、使用!important或CSS变量覆盖。
改背景透明度必须用 rgba()，不是 opacity
Tooltip 的背景透明度不能靠 opacity 实现——它会让文字、箭头、阴影全变淡，可读性直接崩掉。真正起效的是把 background-color 换成 rgba() 值，比如 rgba(0, 0, 0, 0.7)。
常见错误是只写 .tooltip-inner { background-color: rgba(0, 0, 0, 0.7); } 却没加 !important，结果被 Bootstrap 自带的 !important 规则压住；或者忘了箭头也得同步调。
- 必须同时改
.tooltip-inner和它的伪元素.tooltip-arrow::before，否则箭头边缘发灰或颜色割裂 - 深色模式下优先重设 CSS 变量：
body { --bs-tooltip-bg: rgba(0, 0, 0, 0.75); }，但要确保该样式在 Bootstrap CSS 之后加载 - 别漏掉
.tooltip-arrow的border-color（Bootstrap 4/5 兼容写法）或::before的background-color（Bootstrap 5.2+），二者选其一，取决于你用的版本
圆角弧度只能调 .tooltip-inner，不是 .tooltip
.tooltip 是 Popper 生成的定位容器，本身没有背景和圆角；真渲染内容的是子元素 .tooltip-inner。所以圆角必须写在 .tooltip-inner 上，比如 border-radius: 8px;。
但要注意：圆角太大时，.tooltip-arrow 会“悬空”——因为箭头是独立的 div，不随父级圆角裁切。这时要么缩小 border-radius（建议 ≤ 6px），要么用 clip-path 手动裁剪箭头区域。
- 加
padding后文字上下偏移？需同步调整.tooltip-arrow的top或bottom值（Popper 计算位置后会被 padding 推偏） - 如果用了
template注入自定义 class（如.tooltip-warning），CSS 必须写成.tooltip-warning .tooltip-inner { border-radius: 6px; }，不能只写.tooltip-inner - 不要给
.tooltip设overflow: hidden——它会把箭头直接截掉
单个 Tooltip 定制必须用 template + 精确选择器
全局改 .tooltip-inner 会影响所有提示框。想让某个按钮的 Tooltip 红底白字带 4px 圆角，又不影响其他，唯一可靠路径是 JS 初始化时传 template 参数注入专属 class。
默认结构是：<div class="tooltip" role="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>；你要改成：<div class="tooltip tooltip-danger" role="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>。
- CSS 必须匹配这个结构：
.tooltip-danger .tooltip-inner { background-color: rgba(220, 53, 69, 0.9) !important; color: #fff !important; border-radius: 4px; } -
.tooltip-danger .tooltip-arrow::before { background-color: rgba(220, 53, 69, 0.9) !important; }（Bootstrap 5.2+） - 务必保留
.tooltip-arrow和.tooltip-inner这两个类名，否则 Popper 定位逻辑会失效
最容易被忽略的三件事
改完发现还是默认样式？大概率卡在这三点：
- 自定义 CSS 文件没放在 Bootstrap CSS 之后 加载——检查 HTML 中
<link>顺序，变量和!important都救不了加载顺序错 - 箭头颜色没同步改——
--bs-tooltip-arrow-color不随--bs-tooltip-bg自动变化，必须显式设置；用template时也得手动覆盖::before或border-color - 开发者工具里看到的 tooltip 节点在
<body>底部，不是你写的按钮内部——这意味着你写的#my-btn .tooltip-inner根本匹配不上，得用body .tooltip-danger .tooltip-inner这种更宽泛的选择器
