如何添加<link rel="preload" as="font">在字体的 src url

Question

我刚刚知道如何将 rel='preload' 添加到 fonts 源以避免“不可见文本闪烁 (FOIT)” 事情是我在 php 文件中添加了带有所有缩小 css 的字体源，并要求 php 文件代码。 像这样

require_once('styles/common/'.FILENAME_COMMON_CSS);

这是字体 src 的一部分。

@font-face{font-family:'Open Sans';font-style:normal;font-weight:300;src:url(styles/mobile/common/fonts/mem5YaGs126MiZpBA-UN_r8OX-hpOqc.woff2) format("woff2");unicode-range:U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}

当您包含包含您的代码的 css 文件时，有人告诉您添加“预加载”部分，但我将代码放在 php 文件中。 那么有没有办法在上面的代码中添加 rel="preload" ？ 因为我没有使用<link rel="preload" as="font" src='*path*'>

Answer 1

所以显然没有办法像我期望的那样做到这一点，所以我找到了另一种解决方案。 我添加了"font-display: swap;" in @font-face{}. "font-display: swap;" in @font-face{}. 文档说并非所有浏览器都支持此功能。