Windows 10本地开发中font-weight属性无法切换字体权重求助

嘿，我之前也踩过Windows字体合并导致的本地开发字体权重失效的坑，结合你的情况，给你几个亲测有效的解决思路：

1. 给@font-face明确指定font-weight属性 #

你之前给不同权重的字体设置了不同的font-family，但浏览器没法关联它们和权重的对应关系。正确的做法是给同一个font-family下的不同变体指定对应的font-weight值，这样浏览器才能通过font-weight属性切换：

/* 常规权重（400对应默认的normal） */
@font-face {
  font-family: 'Bahnschrift';
  src: url('../bahnschrift.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
}

/* 轻量权重（对应Light变体） */
@font-face {
  font-family: 'Bahnschrift';
  src: url('../bahnschrift light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
}

/* 粗体权重（对应Bold变体） */
@font-face {
  font-family: 'Bahnschrift';
  src: url('../bahnschrift bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
}

使用的时候只需要统一调用同一个font-family，再通过font-weight切换：

.light-text {
  font-family: 'Bahnschrift';
  font-weight: 300; /* 自动匹配Light变体 */
}

.bold-text {
  font-family: 'Bahnschrift';
  font-weight: 700; /* 自动匹配Bold变体 */
}

2. 检查Windows字体的安装状态 #

Windows有时候会把同一系列的字体合并成一个“主字体”，导致浏览器无法识别单独的权重变体。你可以这样检查：

• 打开控制面板 → 字体，找到你正在使用的字体（比如Bahnschrift）
• 右键点击字体，选择「显示更多字体变体」
• 确认每个权重（Light、Regular、Bold等）都有独立的条目，如果缺失的话，需要重新安装对应的单独字体文件，而不是安装合并版的字体包。

3. 清除浏览器和Windows字体缓存 #

重装系统后，旧的字体缓存可能会干扰新字体的识别：

• 浏览器缓存：按Ctrl+Shift+Del打开清除界面，选择清除缓存和网站数据，然后重启浏览器。
• Windows字体缓存：以管理员身份打开命令提示符，输入以下命令重启字体缓存服务：

  net stop fontcache
  net start fontcache
  

  或者手动删除缓存文件：打开C:\Windows\ServiceProfiles\LocalService\AppData\Local\FontCache，删除里面的所有文件，然后重启电脑。

4. 切换到WOFF2字体格式 #

TTF格式在Windows上有时候会因为字体合并机制出现兼容性问题，建议把字体转换成WOFF2格式（浏览器支持更好，体积更小）。你可以用开源工具比如FontForge或者ttf2woff2命令行工具转换，然后修改@font-face的引用：

@font-face {
  font-family: 'Bahnschrift';
  src: url('../bahnschrift.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
}

先试试第一个方法，这是最常见的问题根源，要是不行再依次排查后面的步骤，应该能解决你的问题。

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