Bootstrap 5.3.1字体粗细工具类：无法调用900（Black）权重问题咨询

这不是Bug，是你对fw-bolder的预期理解有误。

为什么fw-bolder没效果？ #

Bootstrap里的fw-bolder对应的是CSS的bolder关键字，并非固定的900权重。CSS的bolder逻辑是相对于父元素的字体权重向上提升一个层级，但前提是你使用的字体家族支持更粗的权重等级。如果你的标题已经是当前字体能提供的最粗权重（比如字体仅支持到700、没有900字重），或者父元素本身已是最高权重，添加fw-bolder自然不会有任何变化。

再看你贴出的配置，$font-weight-bolder的默认值就是bolder，而非900，它从设计上就不是用来直接设置900权重的工具类。

如何调用font-weight 900（Black）样式？ #

有几种便捷方法：

• 自定义CSS类：直接写一个全局可用的类

  .fw-black {
    font-weight: 900 !important;
  }
  

  之后给目标元素添加fw-black类即可。

• 修改Bootstrap变量（Sass环境）：
  如果你用Sass编译Bootstrap，可直接修改变量值：

  $font-weight-bolder: 900 !default;
  

  重新编译后，fw-bolder就会对应900权重。

• 新增工具类（Sass环境）：
  在字体粗细工具类配置里新增black项：

  "font-weight": (
    property: font-weight,
    class: fw,
    values: (
      lighter: $font-weight-lighter,
      light: $font-weight-light,
      normal: $font-weight-normal,
      medium: $font-weight-medium,
      semibold: $font-weight-semibold,
      bold: $font-weight-bold,
      bolder: $font-weight-bolder,
      black: 900 // 新增该行
    )
  ),
  

  编译后就能通过fw-black类直接调用900权重。

内容的提问来源于stack exchange，提问作者mayersdesign