Navbar折叠图标线条粗细由SVG的stroke-width属性决定，需通过替换base64编码SVG或伪元素注入自定义SVG来修改，直接调整CSS变量--bs-navbar-toggler-icon-width仅缩放整体图标而不改变线条粗细。
Navbar折叠图标（hamburger icon）的线条粗细由CSS变量控制
Bootstrap 5.3+ 默认使用 SVG 图标作为 navbar-toggler-icon，其三条横线的粗细由 stroke-width 决定，而该值来源于 CSS 自定义变量 --bs-navbar-toggler-icon-width 和 --bs-navbar-toggler-icon-height ——但注意：**实际线条粗细并不直接等于这两个变量，而是由 SVG 的 viewBox 和内置 path 的 stroke-width 属性硬编码决定**。
也就是说，单纯改 --bs-navbar-toggler-icon-width 只影响图标整体缩放，不改变线条视觉粗细；真正起作用的是覆盖 SVG 内联样式或重写 .navbar-toggler-icon 的背景 SVG 内容。
覆盖默认SVG，自定义 stroke-width 最可靠
Bootstrap 把图标定义为 background-image: url("data:image/svg+xml,...")，所以最稳妥的方式是用你自己的 base64 编码 SVG 替换它，其中明确设置 stroke-width（例如 stroke-width="2"）。
- 打开 Bootstrap 官方 SVG 源（三条横线）：
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30 30"><path stroke="currentColor" stroke-linecap="round" stroke-miterlimit="10" stroke-width="2" d="M4 7h22M4 15h22M4 23h22"/></svg>
- 把
stroke-width="2"改成你需要的值（如"1.5"或"2.5"），然后用在线工具转成 base64 - 在你的 CSS 中覆盖：
.navbar-toggler-icon { background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMCAzMCI+PHBhdGggc3Ryb2tlPSJjdXJyZW50Q29sb3IiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBzdHJva2Utd2lkdGg9IjEuNSIgZD0iTTEgN2gyOG0xIDhoMjZtMSAxOGgyNiIvPjwvc3ZnPg=="); } - 确保这条 CSS 在 Bootstrap CSS 之后加载，且未被
!important阻断
用伪元素 + SVG inline 方式更易维护（推荐）
如果项目已用构建工具（如 Vite/Webpack），建议把 SVG 提成独立文件或组件，避免 base64 难调试。但若只改一处，可改用 ::before 伪元素注入内联 SVG：
- 移除原图标：
.navbar-toggler-icon { background-image: none; } - 用伪元素插入可控 SVG：
.navbar-toggler-icon::before { content: ""; display: block; width: 1.5rem; height: 1.5rem; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='currentColor' stroke-linecap='round' stroke-miterlimit='10' stroke-width='1.8' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E") no-repeat center / contain; } -
stroke-width='1.8'可随时调整，URL 中需对、<code>>、'做 URI 编码（用encodeURIComponent或在线 encoder）
别碰 --bs-navbar-toggler-icon-font-size——它无效
这个 CSS 变量在 Bootstrap 源码里存在，但**完全没被任何地方引用**，属于遗留占位符。试图通过它缩放图标只会无效。真正影响图标的尺寸变量是：--bs-navbar-toggler-padding-x、--bs-navbar-toggler-height，但它们只控制按钮区域大小，不改变 SVG 线条本身粗细。
常见误操作是调大 font-size 或用 transform: scale()，结果导致线条模糊或错位——SVG 是矢量，但缩放会破坏 stroke-width 的像素对齐，尤其在小尺寸下明显发虚。
真正要改粗细，就得动 SVG 的 stroke-width 属性本身；其他所有“间接方式”要么无效，要么引入新问题。
