.fw-bold 不生效主因是字体不支持 bold 字重、CSS 加载顺序错误或被更高权重样式覆盖；应检查 DevTools 中 font-weight 是否为 700、字体文件是否含 weight=700，并确保未被 .navbar-dark 等类削弱视觉效果。
.fw-bold 类就能加粗，不用写 css；但加了没反应，基本是字体文件不支持、加载顺序错、或被其他样式盖掉了。
为什么 .fw-bold 有时不生效
不是类没用，而是浏览器根本没法渲染出 bold 效果：
-
font-weight: 700被设了，但当前加载的字体（比如Inter-Regular）本身不含 weight 700 字重，浏览器只能“模拟加粗”，结果模糊、发虚，甚至看起来更细 - Bootstrap CSS 文件加载晚于自定义 CSS，导致你写的
.navbar-brand { font-weight: bold; }被后加载的.fw-medium覆盖 - 用了
style="font-weight: 600"这类内联样式，权重高于.fw-bold，直接赢了选择器竞争 - 在
.navbar-dark下加了.fw-bold，但颜色被覆盖成浅灰，加粗后反而对比度下降，显得“更淡”
正确加粗的三步操作
优先走 Bootstrap 内置路径，避开手写 CSS 的坑：
- 给
<span class="navbar-brand">MySite</span>直接加.fw-bold： - 确认字体文件已包含 bold 字重：打开 DevTools → Elements → Computed → 查
font-weight是否真为700，再点开font-family看实际加载的 woff2 文件名，比如inter-var-latin.woff2是否带weight=700 - 如果用了
.navbar-dark，加粗后文字发灰，就补一个显式颜色：.navbar-brand.fw-bold { color: #fff; }或直接加.text-white
响应式加粗要小心
.fw-* 类没有响应式变体（比如没有 .fw-bold d-lg-inline），所以不能只在大屏加粗、小屏还原：
- 想桌面加粗、移动端常规？必须手写媒体查询 CSS：
@media (min-width: 992px) { .navbar-brand { font-weight: 700; } } - 想绑定特定字体（如
'Inter-Bold'），得先确保@font-face正确引入了 bold 版本，否则font-weight: 700仍无效 - 旧项目还在用 Bootstrap 4？它没有
.fw-bold，得用.font-weight-bold，别混用 v4/v5 类名
真正卡住的往往不是“怎么加粗”，而是“为什么加粗后看不出变化”——先看 DevTools 里 computed 的 font-weight 和 font-family，再查字体文件是否到位，比反复改 class 有效得多。
