必须重写 .navbar-collapse.show 的 transition 声明并同步调整 max-height 终点值，否则慢速动画下内容会被截断；--bs-navbar-collapse-transition 变量仅用于 Sass 编译，不支持运行时覆盖。
改动画速度不是调 JavaScript 或 data-bs-* 属性，必须重写 .navbar-collapse.show 的 transition 声明，并同步调整 max-height 终点值，否则慢速动画下内容会被截断。
为什么直接改 --bs-navbar-collapse-transition 变量没用
Bootstrap 5.3+ 确实定义了 --bs-navbar-collapse-transition 变量，但它只在源码内部被引用，不支持运行时覆盖。浏览器不会读取这个变量来更新动画逻辑——它只是 Sass 编译时的占位符。你看到的动画始终由最终生效的 transition CSS 声明控制。
- 所有自定义 CSS 必须放在 Bootstrap 官方 CSS 文件之后加载，否则会被覆盖
- 必须锁定
.navbar-collapse.show这个选择器，因为收起态是max-height: 0，动画只在.show类存在时触发 - 别只改
.navbar-collapse基础态，它对动画无影响
怎么安全地调慢动画到 0.6s～0.8s
把默认的 0.35s 改成 0.6s 或 0.8s 后，如果菜单只显示前两行、底部空白，不是代码写错了，而是 max-height 终点值没跟着变大。动画越慢，浏览器越严格按你写的终点高度渲染；而 Bootstrap 默认的终点（如 300px）是固定估算的，不随动画时长自适应。
- 推荐写法：
.navbar-collapse.show { max-height: 120vh !important; transition: max-height 0.6s ease-in-out !important; } -
120vh比100vh更稳妥，能覆盖滚动条、padding 和下拉菜单展开后的额外高度 - 菜单项极少（≤5 个）时，可写死像素值，比如
max-height: 240px，更轻量，减少低端机重排卡顿 - 绝对不要用
max-height: none或fit-content，它们不参与 transition，动画会立即跳到展开态
动画曲线选 ease-in-out 而不是 linear
移动端手指操作需要明确的“启动-过渡-落地”节奏。linear 会让动画显得生硬、缺乏反馈感；ease-in-out 开头柔和加速、结尾渐缓收住，更符合直觉。
- 避免自定义
cubic-bezier()曲线——除非你有设计规范强约束，否则容易让动画失重或拖沓 - 别在
.navbar-collapse基础态里设transition，它只影响收起过程，且可能干扰 JS 初始化 - 如果用了
.dropdown，确保其.dropdown-menu在折叠态下没有误加top: 100%，否则会向上溢出容器，看起来像动画中途跳变
最常被忽略的是：动画变慢后，max-height 终点值必须同步增大，且必须用可动画的值（vh 或像素），不能依赖“内容自适应”这类语义化但不可过渡的单位。这点在真机上尤其明显——模拟器常因渲染优化掩盖问题，而实际设备会严格按 CSS 规则执行。
