改了 $navbar-height 没生效，是因为该 Sass 变量仅在源码重编译时起作用；直接使用 bootstrap.min.css 或 CDN 时，它已被编译为固定数值，CSS 中不存在该变量，必须通过覆盖 .navbar 相关 padding、line-height、max-height 等实际撑高属性来调整高度。
为什么改了 $navbar-height 没生效
改变量只在你用 Sass/Less 重编译时才起作用，直接引入 bootstrap.min.css 或 CDN 的项目里，$navbar-height 已经被编译成固定数值，CSS 文件里根本搜不到它。常见误操作是：改了 _variables.scss 却没运行 sass 命令、没配好构建流程，或者改完只替换了 navbar 部分 CSS —— 这会导致 .dropdown-menu 垂直间距、.navbar-brand 行高错位等连锁问题。
真正生效的前提只有两个：你控制源码构建流程，且整个 Bootstrap CSS 被完整重新编译。否则，老老实实用 CSS 覆盖。
.navbar 高度覆盖总不生效的几个硬坑
不是选择器写得不够狠，而是你没盯住实际撑高的那几条属性：
-
.navbar默认靠padding-top+padding-bottom+line-height（来自.navbar-brand和.nav-link）共同撑高，单独设height或min-height很可能被 padding 盖过去 - 检查 DevTools 的 Computed 标签页，确认你写的
padding值真被应用了——常被.navbar-expand-*类里媒体查询中的更高优先级规则覆盖 - 用了
.fixed-top？别忘了同步加body { padding-top: 64px; }，否则内容被遮住，误判“没变高” - 品牌图是
<img>？它默认按 intrinsic size 渲染，.navbar-brand的height不会自动约束它，得加.navbar-brand > img { height: 1.5rem; width: auto; }
移动端折叠菜单展开后高度被截断
根本不是导航栏本身矮了，而是 .navbar-collapse 的 max-height 动画值不够大。Bootstrap 用固定值（如 300px）做过渡，一旦菜单项文字换行、带图标或嵌套下拉，就直接溢出被裁。
稳妥解法是覆盖这个值：
.navbar-collapse.show {
max-height: 120vh !important;
}注意三点：
- 必须用
vh或足够大的像素值（比如800px），none或fit-content会断掉过渡动画 - 如果菜单项极少（≤4 个），可精确计算：
48px × 项数 + 2rem，写死更轻量 - 含
.dropdown？它的.dropdown-menu默认position: absolute，不参与父容器高度计算，展开时视觉上“顶高”但max-height不扩容——此时要么加.dropdown-menu { position: static !important; }，要么删掉data-bs-popper让它回归文档流
响应式断点下高度不同步的典型表现
桌面看着正常，切到手机发现导航栏突然“缩水”，大概率是漏掉了 @media 查询里的内边距调整。Bootstrap 的 .navbar-expand-lg 在 992px 断点切换行为，但很多人抄错成 991.98px（那是旧版 Safari hack，5.x 已弃用），导致自定义样式没命中。
关键动作是：在对应断点里同步重置所有撑高相关属性：
@media (max-width: 991.98px) {
/* 错！Bootstrap 5 实际断点是 992px */
}
@media (max-width: 991px) {
/* 更错！连 hack 都抄漏了小数位 */
}
@media (max-width: 992px) {
.navbar {
padding-top: 0.75rem;
padding-bottom: 0.75rem;
}
.navbar-brand,
.nav-link {
padding-top: 0.5rem;
padding-bottom: 0.5rem;
}
}真正难调的从来不是单端，而是桌面设了 64px，手机却因未覆盖而回落到默认 56px——这种差值在折叠菜单展开时会放大成内容截断，得两端一起盯。
