
通过 font-weight 使用数值(如 900)而非关键字(如 bolder),可精准控制字体粗细,实现比默认 bolder 更强的加粗效果。
通过 `font-weight` 使用数值(如 900)而非关键字(如 `bolder`),可精准控制字体粗细,实现比默认 `bolder` 更强的加粗效果。
在 CSS 中,font-weight 是控制文本粗细的核心属性。虽然 bolder 和 lighter 等相对关键字看似便捷,但它们依赖于父元素的当前字重进行“相对提升”,实际效果不可控且常受限于字体本身支持的字重层级——许多系统字体(如默认的 sans-serif)仅提供 normal(400)和 bold(700)两级,此时 bolder 往往等同于 700,无法进一步加粗。
要获得真正更强的加粗效果,推荐使用无单位数值字重(numeric font weight):
- 取值范围为 100~900(以 100 为步长)
- 400 等价于 normal,700 等价于 bold
- 900 是标准最大值,代表该字体所能提供的最粗样式(前提是字体文件包含对应字重)
✅ 正确示例:
.txt {
font-weight: 900; /* 强制使用最粗字重 */
text-align: left;
margin: 100px 0 750px 25px;
color: #000;
}⚠️ 注意事项:
- 字体支持是前提:若所用字体(如自定义 Web Font)未内嵌 900 字重,浏览器将降级至最接近的可用字重(如 700 或 800)。可通过 @font-face 显式加载不同字重的字体文件确保一致性。
- 避免使用带引号的字符串(如 font-weight: "900"),CSS 数值无需引号。
- justify-content 对纯文本元素(如 )无效,除非其 display 为 flex 或 grid;普通块级文本应依赖 text-align 控制对齐。
? 总结:放弃模糊的 bolder,拥抱精确的数值控制——font-weight: 900 是实现极致加粗的可靠方案,配合字体资源优化,即可稳定输出视觉冲击力更强的标题或强调文本。










