直接修改 .navbar-brand img 的 width 和 height: auto 即可，Bootstrap 默认不限制尺寸，最终由图片自身、CSS 或响应式规则决定；需避免 font-size（对 <img> 无效）、内联样式及 img-fluid，并注意 min-height、line-height 和 SVG 的 viewBox 等干扰因素。
直接改 .navbar-brand img 的宽高就行
bootstrap 默认不限制 .navbar-brand 里 img 的尺寸，最终大小由图片原始尺寸、css 或响应式规则共同决定。最稳妥的做法是给 img 元素单独加 css 规则，而不是依赖父容器或字体缩放。
- 必须用
width+height: auto（或max-height）组合，否则 SVG 或 PNG 可能拉伸变形 - 别用
font-size控制 —— 它对<img>完全无效，只影响<i class="bi bi-x">这类字体图标 - 避免写内联样式如
style="width: 120px"，优先放在自定义 CSS 文件末尾，用.navbar-brand img这类明确选择器确保权重足够 - 如果用了
background-image替代img标签，那调width/height没用，得换background-size
img-fluid 对 Logo 没用，别乱加
img-fluid 是为内容区普通图片设计的，核心是 max-width: 100% + height: auto。但 .navbar-brand 本身高度受限、行内布局紧凑，强行加 img-fluid 反而容易让 Logo 在小屏下过小或错位。
- 导航栏 Logo 需要的是「稳定可预期的尺寸」，不是「随父容器流体缩放」
- 加了
img-fluid后再设max-height，浏览器仍按原始宽高比计算高度，max-height很可能不触发裁剪，只是“上限摆设” - 若真要用响应式缩放，应配合媒体查询单独控制：
@media (max-width: 768px) { .navbar-brand img { max-height: 32px; } }
父容器的 min-height 和 line-height 在偷偷搞事情
即使你把 .navbar-brand img 设成 height: 24px，整个导航栏仍可能卡在 56px（BS5）或 50px（BS4）——问题往往出在 .navbar 和 .navbar-brand 自身的默认样式上。
-
.navbar默认有min-height: 56px，.navbar-brand默认继承line-height，两者叠加会让小图标上下留白难控 - 检查开发者工具的 Computed Styles，确认实际生效的是哪个值
- 覆盖方案：给
.navbar加min-height: auto，或精确设为min-height: 48px；给.navbar-brand加line-height: 1+padding: 0 - 如果用了 flex 布局居中，优先用
display: flex; align-items: center，别依赖line-height垂直居中
SVG Logo 要特别注意 viewBox 和 height: auto
Inline SVG 或外链 SVG 作为 Logo 时，font-size 无效，width 单独设也不安全 —— 缺少 viewBox 会导致缩放失真，固定 height 会强制拉伸。
- 正确写法示例：
<svg width="2rem" height="auto" viewBox="0 0 16 16"></svg> -
viewBox必须存在，它是 SVG 缩放的坐标系基准，漏掉就等于没设比例 - 用
height: auto配合width，才能保持等比缩放；写死height="24"会破坏响应性 - 如果 SVG 是通过
background-image引入的，那就得用background-size: contain或1.5rem 1.5rem，和<img>完全两套逻辑
<img>、<svg> 还是 background-image 实现的 —— 三种方式的控制逻辑完全不同，混用又没统一基准，调试时就会反复踩坑。 
