css中字体的加载，仅在使用的时候加载，会阻塞，用font-display:swap
在 @font-face 中指定字体的 src URL时，字体文件仅会在实际使用该 font-family 的时候加载。也就是说，如果你没有在页面上使用该字体（即没有设置 font-family 为指定的字体），浏览器不会加载那个字体文件。
但是如果系统中有该字体的使用，字体的加载会阻塞页面的渲染，所以使用 font-display: swap; 可以避免页面空白
font-display: swap;的作用是在自定义字体加载之前，浏览器先使用一个备选字体来渲染文本，等到自定义字体加载完成后，再切换到自定义字体。
@font-face {
font-family: 'times roman';
font-display: swap;
src: url(https://OPTITimes-Roman.otf);
}