应另起自定义类名并在bootstrap css后加载,监听shown.bs.collapse等事件触发动画,避免修改核心类;入场缩放需等高度展开后添加transform,modal需分别控制入场退场及backdrop动画,排查display:none、css权重和硬件加速问题。

用 transition 和 animation 替换 Bootstrap 默认过渡
Bootstrap 的 fade、slide 等动画本质是 CSS 类 + transition 或 @keyframes,但它们被写死在 bootstrap.css 里,直接覆盖类名(比如 .fade)容易失效——因为 Bootstrap 的 CSS 权重高,且部分动画依赖 JS 动态加/删类的时机。
正确做法是:不碰原生类,另起一套自定义类名,用 !important 控制关键属性(仅限必要项),并确保在 Bootstrap CSS 之后加载你的样式。
- 把自定义动画 CSS 放在
<link rel="stylesheet">引入 Bootstrap 之后,或用<style></style>写在
前端入门到VUE实战笔记:立即使用
在学习笔记中,你将探索 前端 的入门与实战技巧!











