必须显式重写 .navbar-collapse.show 的 transition 并加 !important，同步调整 max-height 值与动画时长，同时处理 .dropdown 定位干扰才能使移动端菜单动画生效。
直接改 .navbar-collapse.show 的 transition 才生效
Navbar 移动端菜单的动画不是 JS 控制，也不是 data-bs-toggle 决定快慢——它纯靠 CSS 的 max-height 过渡。Bootstrap 5.3+ 虽然定义了 CSS 变量 --bs-navbar-collapse-transition，但这个变量只供内部引用，**你不能靠改变量来覆盖动画**。
必须显式重写 .navbar-collapse.show 的完整 transition 声明，并加 !important 确保压过默认样式。自定义 CSS 文件要放在 Bootstrap CSS 之后加载，否则规则不生效。
.navbar-collapse.show { transition: max-height 0.6s ease-in-out !important; }- 别只写
transition-duration行内样式——它无法单独覆盖复合属性 - 别只改
.navbar-collapse基础态，收起时高度为0，动画全靠.show类触发
max-height 必须同步调大，否则内容被截断
把动画从 0.35s 改成 0.8s 后菜单只显示前两行？这不是动画出错，是 max-height 终点值没跟着变大。浏览器对慢速过渡更严格：它会按你写的数值精确渲染高度，而 Bootstrap 默认的终点值（如 300px）是固定估算的，不随动画时长动态调整。
- 不能用
max-height: none—— 它不参与transition，动画会立即跳到展开态 - 避免
max-height: 100%或fit-content—— 这些值无法作为合法过渡终点，浏览器会退回到0 - 推荐写法：
.navbar-collapse.show { max-height: 120vh !important; transition: max-height 0.8s ease-in-out !important; } - 精简菜单（≤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预留空间，而非依赖自动撑开 - 排查是否误写了
.dropdown-menu { top: 100% }—— 移动端折叠态不需要这个 - 真要让下拉菜单随文档流撑高：
.dropdown-menu { position: static !important; }
缓动函数选 ease-in-out，别碰 linear
移动端触控反馈敏感，linear 动画手感生硬，容易显得机械；ease-in-out 更自然。若追求更高顺滑度，可用贝塞尔曲线：cubic-bezier(0.25, 0.46, 0.45, 0.94)，比 ease-in-out 更柔和，避免“弹跳感”。
- 设为
0.2s以下，动画会突兀；超过0.8s用户易感知延迟，尤其小屏场景 - 不要用
transition: all或给.navbar-collapse加border/padding—— 这些属性不参与max-height插值，反而挤占可用空间，导致内容“突然弹出” - 确保子元素没意外设置
overflow: hidden，否则内部内容撑高时被裁剪，动画终点高度计算错误
.navbar-collapse.show、同步调大 max-height 和 transition-duration、处理好 .dropdown 的定位干扰。最容易被忽略的是——max-height 值和动画时长必须匹配，缺一不可。 
