You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何让font-display配合unicode-range,避免英文文本等待希伯来字体加载

混合希伯来语与英文字符的字体加载优化问题

当前用于加载自定义希伯来字体的CSS:

@font-face {
  font-family: 'Taamey David CLM';
  src: url('TaameyDavidCLM/TaameyDavidCLM-Medium.woff2') format('woff2'),
       url('TaameyDavidCLM/TaameyDavidCLM-Medium.woff') format('woff');
  font-weight: 500;
  font-style: normal;
  font-display: block;
  unicode-range:  U+0590-05FF, U+FB1D-FB4F;
}

容器的字体设置:

#container p {
  font-family: 'Taamey David CLM', Times, Serif;
}

我希望通过font-display: block让希伯来字符在字体加载完成前不显示,避免出现字体切换的闪烁问题。但实际情况是,英文文本也会等待希伯来字体下载完成后才渲染。

原本预期浏览器会先尝试为所有文本应用自定义字体,随后通过unicode-range识别出英文字符不在该字体覆盖范围内,直接回退到font-family列表中的Times字体。但实际浏览器必须下载完该字体后,才会判断英文字符超出范围并切换到Times。

需要一个纯CSS的解决方案,让英文文本直接使用Times字体,无需等待希伯来字体下载。(注:给希伯来语和英文文本分别添加HTML类的方法不可行,因为文本是用户输入的混合内容,操作成本过高。)

补充特殊现象

如果文本中有仅包含英文字符的<i>或<b>标签,且已为该字体添加对应的斜体/粗体版本@font-face声明,那么这些标签内的英文文本会在字体下载前就直接用Times渲染;但同样是仅含英文的<span>标签,里面的文本却仍需等待希伯来字体下载完成才会回退到Times,不清楚这两种场景的差异所在。

内容的提问来源于stack exchange,提问作者ak0000

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.29 12:40:03