bootstrap 5 不支持“在某个断点下取消粗体”的反向响应式操作，仅提供“≥某断点启用某字重”的正向类（如fw-bold-md），需组合fw-normal与fw-bold-md实现小屏常规、大屏加粗；5.2及更早版本需手动添加带!important的媒体查询自定义类。
Bootstrap 5 中用 font-weight 响应式工具类控制字重
Bootstrap 5 内置了响应式字体粗细工具类，但**不支持“在某个断点下取消粗体”这种反向操作**——它只提供“在 ≥ 某断点时启用某字重”，没有 fw-normal@md 这类写法。所以不能靠单个 class 实现“大屏粗体、小屏常规体”的切换。
正确做法：组合使用基础字重 + 响应式覆盖
必须显式声明默认字重，再在目标断点上覆盖。例如让文字在 md 及以上变粗、sm 及以下保持常规体：
<p class="fw-normal fw-bold-md">这段文字</p>
注意：fw-bold-md 是 Bootstrap 5.3+ 新增的响应式工具类（旧版需手动扩展）。如果你用的是 5.2 或更早版本，该类不存在，会失效。
- 5.3+ 支持的响应式字重类有：
fw-lighter-sm、fw-light-sm、fw-normal-sm、fw-bold-sm、fw-bolder-sm，后缀可换为-md/-lg/-xl/-xxl - 类名顺序无关紧要，CSS 层叠由媒体查询决定，不是靠 class 书写顺序
- 别写成
fw-bold fw-normal-md——fw-normal-md本身不存在，Bootstrap 官方只提供fw-*-{breakpoint}形式，且fw-normal是默认值，不参与响应式生成
Bootstrap 5.2 及更早版本怎么办？
原生不支持响应式 font-weight，必须自己补：
@include media-breakpoint-up(md) {
.fw-bold-md {
font-weight: 700 !important;
}
}
然后在 HTML 中同样写 class="fw-normal fw-bold-md"。关键点：
- 一定要加
!important，否则可能被其他样式覆盖 - 不要复用
fw-bold的 CSS 规则，因为它的选择器权重和媒体查询范围不同 - 如果项目用了 Sass，直接在自定义 SCSS 文件里扩展；如果只用 CDN，就得内联 style 或额外加载一段 CSS
为什么不用 font-weight: normal 写内联样式？
可以，但破坏响应式抽象，且难维护：
<p style="font-weight: normal; font-weight: bold" media="(min-width: 768px)">…</p>
这写法无效——HTML 不支持在 style 属性里写媒体查询。真正可行的是：
- 用
@media包裹内联 style（不推荐，语义混乱） - 用 JavaScript 监听
resize动态切 class（性能差、不必要） - 老老实实走 CSS 响应式类路径，哪怕多写一个 class
最易忽略的是：很多开发者以为 fw-normal 能响应式，结果在小屏看到的还是粗体——因为没意识到它只是重置默认值，不带媒体查询逻辑。
