必须修改 .navbar-collapse.show 的 transition 和 max-height 属性才生效，因动画纯由 CSS 的 max-height 过渡控制；需同步增大 max-height（如 120vh）并设 transition: max-height 0.8s ease-in-out !important，避免内容截断或跳变。
直接改 .navbar-collapse.show 的 transition 才生效
Navbar 移动端菜单的展开速度不是由 JavaScript 控制，也不是靠 data-bs-toggle 的属性值调节——它纯靠 CSS 的 max-height 过渡动画。Bootstrap 默认用的是类似 max-height 0.35s ease-in 的声明（5.3+ 版本由 CSS 变量 --bs-navbar-collapse-transition 定义），但这个变量**不能直接覆盖生效**。
你必须在自定义 CSS 中显式重写这个选择器：
-
.navbar-collapse.show是唯一有效的目标，因为收起态是max-height: 0，动画只在加了.show类时触发 - 必须加
!important，否则会被 Bootstrap 内置样式压制 - 自定义 CSS 文件要放在 Bootstrap CSS 之后加载，否则规则不生效
- 别只写
transition-duration行内样式，它无法单独覆盖完整的transition声明
max-height 和 transition-duration 必须同步调
把动画从 0.35s 改成 0.8s 后菜单只显示前两行？这不是动画出错，是 max-height 终点值没跟着变大。浏览器对慢速过渡更严格：它会按你写的 max-height 精确渲染高度，而 Bootstrap 默认的终点值（比如 300px 或 1000px）是固定估算的，不随动画时长动态调整。
- 推荐写法：
.navbar-collapse.show { max-height: 120vh !important; transition: max-height 0.8s ease-in-out !important; } - 不能用
max-height: none——它不参与transition，动画会立即跳到展开态 - 避免
max-height: 100%或fit-content——这些值无法作为 transition 的合法终点，浏览器会退回到0 - 菜单项 ≤5 个时可写死像素值，如
max-height: 240px，更轻量，减少低端机重排卡顿
下拉菜单（.dropdown）会让动画错位或卡顿
折叠菜单里嵌了 .dropdown，点开二级菜单时出现“先展开、再突然撑高”或“动画中途跳一下”，根本原因是 .dropdown-menu 默认 position: absolute，不占 .navbar-collapse 高度，但它的父容器（如 .nav-item）若有 padding-block 或 min-height，视觉上“变高”却没被 max-height 涵盖。
- 给
.nav-item去掉min-height，改用padding-block: 0.5rem控制间距 - 在
.navbar-collapse.show上加padding-bottom: 1rem预留空间，而非依赖自动撑开 - 真要让下拉菜单随文档流撑高：
.navbar-collapse.show .dropdown-menu { position: static !important; } - 排查是否在
@media (max-width: 991.98px)下误写了.dropdown-menu { top: 100% }——移动端折叠态不需要这个
缓动函数别乱选，ease-in-out 不是最优解
默认的 ease-in 有轻微“弹跳感”，linear 在移动端手感生硬，ease-in-out 虽平滑但收尾略拖沓。更自然的选择是贝塞尔曲线：
- 推荐：
cubic-bezier(0.25, 0.46, 0.45, 0.94)，比ease-in-out更顺滑，收尾更利落 - 设为
0.2s以下会显得突兀；超过0.8s则用户易感知延迟，尤其在小屏触控场景 - 别在
.navbar-collapse基础态上设transition——收起时没有动画，只影响展开逻辑 - 动画曲线和时长必须一起测试，单改一个容易导致插值断裂，表现为“卡一下”或“突然出现”
max-height 起止值是否构成可插值的数值对，以及所有干扰盒模型的样式（border、overflow: hidden、position: absolute）是否已清理干净。 
