应直接修改 css 的 transition 值而非 js 参数，bootstrap modal 动画由 .modal.fade .modal-dialog 的 transition 控制，需同时设置 transform 和 opacity，避免全局污染及移动端卡顿。
直接改 CSS 的 transition 值，别碰 JS 参数
Bootstrap Modal 的淡入淡出速度由 CSS 控制，不是 show() 或构造函数的参数决定。JS 层只负责添加/移除 .show 类，动画行为完全依赖 .fade 类里的 transition 声明。
常见错误是试图传入 { animation: 300 } 或修改 data-bs-animation——这些在 Bootstrap 5 中无效，控制台不会报错，但也不会生效。
-
.fade默认带transition: opacity .15s linear，这是 150ms，不是常见的 300ms，容易误判为“太快” - 必须用更高优先级选择器覆盖，比如
.modal.fade .modal-dialog，避免影响alert、tooltip等其他带.fade的组件 - 自定义 CSS 文件必须在 Bootstrap CSS 之后加载，否则规则被覆盖
.modal.fade .modal-dialog 是关键选择器，不是 .fade 本身
只写 .fade { transition: opacity 0.3s ease; } 会污染全局：所有带 .fade 的组件（如提示框、下拉菜单）都会变慢。真正该改的是模态框专属路径。
正确写法示例：
.modal.fade .modal-dialog {
transition: transform 0.3s ease-out, opacity 0.3s ease-out;
}
- 必须同时声明
transform和opacity，漏掉任意一个会导致位移或透明度不过渡 - 缓动函数建议用
ease-out：show 时更自然，hide 时自动反向应用 - 不要用
all，Safari 下易出错；也不要加!important，靠选择器权重就能赢过默认样式
移动端卡顿？不是时间拉长就能解决
把 0.15s 改成 0.5s 可能让 iOS Safari 或老旧安卓 WebView 更卡——因为主线程被长时间占用，而非动画本身慢。
- 给
.modal-dialog加will-change: transform或transform: translateZ(0)，强制 GPU 渲染 - 避免在
.modal-dialog上设margin动画，它会触发 layout，拖慢整个过渡 - 检查是否误启了
data-bs-animation="true"（Bootstrap 5.3+），这个属性会绕过 CSS transition，改走 JS 动画逻辑，导致你的 CSS 覆盖失效
验证是否生效，盯住「Computed」面板
浏览器开发者工具里打开「Computed」标签页，选中 .modal-dialog 元素，搜索 transition，看最终生效的值从哪来。比猜更可靠。
容易被忽略的是作用域泄漏：很多人调试半天 JS，结果发现只是 .fade 规则让 tooltip 也变慢了。
真正要改的只有三处：初始态、目标态、遮罩层的 transition，缺一不可；而最常漏掉的，是没同步改 .modal.fade .modal-backdrop 的 opacity 过渡。
