必须同时调整data-bs-interval和transition-duration：前者控制切换间隔（如3000ms），后者控制动画时长（如0.3s），且需满足data-bs-interval≥transition-duration×1000+100ms，否则出现闪屏或跳变；三类css选择器（.carousel-item、.active、.next/.prev）的transition值必须完全一致。
改轮播图切换速度，必须分清两个独立参数：一个是 data-bs-interval（或 js 的 interval），控制“等多久切下一张”；另一个是 css 的 transition-duration，控制“滑动动画本身多快”。只调其中一个，大概率出现闪屏、跳变或触控不同步。
如何用 data-bs-interval 控制自动轮播节奏
这个属性决定每张图停留多少毫秒后自动切换，是最快见效的调整点。
-
data-bs-interval="3000表示 3 秒切一张；设为0或false会禁用自动播放 - 它只在组件**首次初始化时读取一次**，后续改 HTML 属性不会生效；动态改需先
carousel('pause')，再更新_config.interval，最后carousel('cycle') - 多个轮播图共用
$('.carousel').carousel({ interval: 2000 })会全部被覆盖——每个实例必须单独初始化，别用通配符选择器 - 值低于
500容易导致用户来不及操作指示器或暂停按钮，尤其在移动端
为什么只改 transition-duration 会跳变
Bootstrap 5.3+ 的轮播动画由三类状态协同驱动，漏掉任何一个都会视觉撕裂。
-
.carousel-item：定义基础过渡规则，但仅影响初始状态 -
.carousel-item.active：控制当前页“保持显示”时的过渡行为 -
.carousel-item-next和.carousel-item-prev：分别控制下一张/上一张“滑入/滑出”的位移动画 - 三者
transition值必须完全一致，例如都写成transform 0.3s ease-in-out, opacity 0.3s ease-in-out
data-bs-interval 和 transition-duration 必须匹配
CSS 控动画过程，JS 控触发节奏。两者不协调，人眼看到的是“闪屏”，不是“快”。
- 公式：
data-bs-interval≥transition-duration × 1000 + 100（单位毫秒） - 比如 CSS 设为
0.3s，HTML 中至少写data-bs-interval="400"，JS 初始化写{ interval: 400 } - 设为负数会被忽略；设为
0或false禁用自动轮播 - 鼠标悬停暂停时，计时器是暂停并继续，不是重置——移开后从剩余时间接着走
移动端 touch 滑动为什么不响应新速度
这不是 CSS 的问题，transition-duration 对 touch 拖拽完全无效。
- touch 滑动依赖 JS 的
touchstart/touchend节流逻辑，和 CSS 过渡时长无关 - 真机测试比 DevTools 的 device toolbar 更可靠——部分 Android WebView 对 touch 事件处理有差异
- 确认引入的是
bootstrap.bundle.min.js（含 Popper），而非仅 CSS +bootstrap.min.js - 检查是否被第三方库（如
hammer.js）劫持了 touch 事件监听器
最常被忽略的点：即使 CSS 和 JS 都配对了，低端设备或复杂 DOM 下仍可能卡顿——给 .carousel-inner 加 will-change: transform 是必要的渲染优化手段。
