谷歌字体显示=交换奇怪的行为

tyl*_*eax 5 html css fonts google-api google-fonts

我试图通过将这段代码注入我的 html 代码来使用 google font api

<link href="https://fonts.googleapis.com/css?family=Playfair+Display|Source+Serif+Pro|Suwannaphum&display=swap" rel="stylesheet">
Run Code Online (Sandbox Code Playgroud)

我发现在加载我的网站时,使用该字体的文本会出现“故障”。它会在短时间内显示为小,然后变为正常。

经过大量试验后,我&display=swap从代码中删除了部分,问题不再发生,我能够使用该字体。

为什么会&display=swap导致故障?我直接从google api字体网站复制了代码。

Ice*_*orn 13

&display=swapfont-display: swap被使用,其允许备用字体(较小的一个你的情况),直到字体已被加载并且可以被交换。

如果不使用&display=swap,您将不会遇到更改字体的问题,但是在您的网站上显示使用该字体的任何文本之前需要更多的时间。