根本原因是.navbar-collapse.show的max-height估算值不足且不能设为none或fit-content；应设为120vh或240px等足够大但可动画的固定值，并排查子元素overflow、定位及图标字体加载问题。
移动端展开菜单被截断，根本不是Navbar本身矮了
是 .navbar-collapse.show 的 max-height 动画值不够大，且 bootstrap 不会动态计算真实内容高度——它用的是写死的估算值（比如 300px 或 1000px），一旦菜单项含多行文字、图标、下拉菜单或字体加载延迟，立刻被 overflow: hidden 切掉。
- 别在 DevTools 里瞎调
.navbar的 height 或 padding，那对折叠态无效 - 检查是否手动加了
.navbar-collapse { max-height: 200px }或height: 60px，删掉它们 - 临时禁用动画：
.navbar-collapse { transition: none; }，如果此时内容不截断，就坐实是max-height问题
怎么安全增大 .navbar-collapse.show 的 max-height
不能设 max-height: none 或 fit-content，CSS transition 不支持这些值作动画终点，会直接让展开变“闪现”。必须用可动画、足够大、又不过度影响性能的值。
- 通用稳妥方案：
.navbar-collapse.show { max-height: 120vh !important; }——vh相对视口，兼顾大小屏，!important确保压过 Bootstrap 默认规则 - 精简场景（≤5 个链接）：
.navbar-collapse.show { max-height: 240px; }—— 每项约 48px 高 + 余量，更轻量，避免低端机重排卡顿 - 别写
100%：它不触发过渡；也别在@media里重复覆盖，统一放全局 CSS 最后
下拉菜单（.dropdown）导致撑高异常怎么办
点开下拉后，整个折叠区突然“变高”，但新高度没被 max-height 包含，内容溢出顶部——这不是 dropdown 本身错，而是它默认 position: absolute 脱离文档流，父容器无法感知其高度。
- 想让它撑高容器：
.navbar-collapse.show .dropdown-menu { position: static !important; } - 或改用
data-bs-popper="static"属性禁用 Popper.js 定位：<ul class="dropdown-menu" data-bs-popper="static"></ul> - 检查是否误写了
@media (max-width: 991.98px) { .dropdown-menu { top: 100% } }—— 移动端折叠状态下这个规则会让下拉框往上跑，删掉
为什么改了还是没反应？几个硬坑要盯住
不是选择器写错，而是被更高优先级规则或隐性约束卡住了。打开 DevTools 的 Computed 面板，看 .navbar-collapse.show 的 max-height 值到底有没有生效。
- 确认子元素没意外加
overflow: hidden或position: absolute，否则脱离文档流，父容器高度无法正确累积 - 检查是否用了自定义图标字体，首次展开时字体未就绪导致高度计算偏小；可临时加
transition: none排查 -
.nav-link的padding和line-height会影响单行高度，若设得太小（如py-1），实际撑起高度就不够，需同步调大
.navbar-collapse.show 的 max-height、内部 .nav-link 的垂直空间、以及 .dropdown-menu 是否还在偷偷脱离文档流——三者缺一，都会让“改高了”变成“看起来没变”。
