在css中使用@ font-face时，浏览器会在字体前加载我的页面文本，这会导致字体从一种样式跳转到另一种样式（从Arial到myfont）。例如，使用压缩字体时，问题在视觉上非常明显。
我只想显示我用@ font-face选择的一种字体。这样做的最佳方式是什么？
答案 0 :(得分：2)
根据我的经验，它被称为FOUT处理它的最好方法是使用Google的字体加载器：
https://developers.google.com/webfonts/docs/webfont_loader
基本上你做的是让页面正常加载（在此期间隐藏正文或隐藏样式字体块，你的选择），一旦加载一个类被添加到页面正文，这会触发显示样式字体。
该脚本添加了这些类，因此您可以适当地设置样式：
.wf-inactive - failed to load
.wf-loading - during load
.wf-active - loaded fine
唯一的缺点是它需要Javascript ..
答案 1 :(得分：0)
在某些浏览器中，这是一个非常着名的问题（Firefox 3.5 / 3.6，IE 7-9）。 WebINK有一个JavaScript文件，可以解决问题。
答案 2 :(得分：0)
这被称为无格式文本Flash ，正如您所提到的那样，应该是与页面其余部分一起加载的字体文件，其文本将使用默认或后备格式设置样式字体，直到加载新的字体并可以应用。
似乎最小化此效果发生的最佳方法是最小化客户端花费加载自定义字体的时间。您可以通过gZip compressing your font files通过gZip指定您的字体文件，并通过far-future expires header指定您的字体文件以供观看者浏览器进行后续观看。
如果FOUT对您的用户来说仍然很不稳定，您可以指定一个类似形状的字体，该字体很可能作为后备安装在大多数观看者的计算机上，以便在自定义字体加载时保持页面大小相对一致。例如，对于您的压缩字体，大多数观看者已将Impact作为可用字体或Arial Narrow，两者都遵循“浓缩”样式。
如果所有其他方法都失败了，您可以随时使用color: rgba(0,0,0,0)设置文档的整个文本样式，并使用JavaScript在计时器结束时删除该规则。