加了 carousel-fade 仍“咔嚓”跳变是因为 CSS 层叠或 DOM 结构问题：必须同时添加 carousel 和 carousel-fade 类；.carousel-item 需 position: absolute；图片/视频需 d-block；过渡样式需正确覆盖且带 .carousel-fade 前缀。
为什么加了 carousel-fade 还是“咔嚓”跳变？
不是 js 没跑，也不是 bootstrap bug，而是 css 层叠或 dom 结构卡住了动画。bootstrap 的 fade 动画纯靠 css 驱动，carousel-fade 只是切换动画类型，不提供轮播逻辑。
- 必须同时写
carousel和carousel-fade—— 只写后者，JS 不初始化、指示器失效、左右按钮失灵 - 检查浏览器开发者工具里，任一
.carousel-item的 computed 样式是否含transition: opacity 0.6s ease和opacity: 0；没有就说明.carousel-fade相关 CSS 没加载（某些精简构建会剔除它） -
.carousel-item必须是position: absolute才能层叠显示；若父容器用了display: flex或外层有transform/filter，会破坏堆叠上下文，opacity 变化不可见 -
<img>或<video></video>默认是display: inline，得统一加class="d-block w-100"，否则过渡不生效
怎么改淡入时长和缓动函数？
Bootstrap 内置的 fade 动画参数（0.6s、ease）写死在 CSS 里，没有 data 属性或 JS 方法可调。想改就得覆盖样式，且必须带 .carousel-fade 前缀，否则会污染其他轮播组件。
- 过渡效果由非
.active的.carousel-item控制，不是.active本身——所以要改.carousel-fade .carousel-item的transition -
.carousel-fade .carousel-item.active只需保证opacity: 1，不用重复写transition - 示例：延长到 1.2 秒并换缓动函数
.carousel-fade .carousel-item {
transition: opacity 1.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.carousel-fade .carousel-item.active {
opacity: 1;
}
用 JS 切换项时 fade 动画不触发？
调用 myCarousel.carousel('next') 或 bootstrap.Carousel.getInstance(el).to(2) 只负责切换 .active 类，动画是否发生，完全取决于 DOM 上是否存在 carousel 和 carousel-fade 类，以及对应 CSS 是否生效。
- 确保切换前容器已正确渲染且类名完整：
class="carousel carousel-fade" - 不要在 JS 中手动增删
.active而忽略 CSS 状态——Bootstrap JS 会自动处理类名切换时机 - 如果轮播初始化后动态插入新
.carousel-item，需调用myCarousel.refresh()（Bootstrap 5.3+）或重新初始化，否则新项无position: absolute和 transition
<img>）若被包裹在 inline 容器里，或外层有 vertical-align、line-height 干扰，也会让 opacity 过渡失效。直接给内容加 d-block 是最快验证方式。
