@font-face 带有多个字体大小的 css 声明会减慢 Firefox 的爬行速度

Question

CSS：

@font-face {
    font-family: Gabriola;
    font-weight: normal;
    font-style: normal;
    src: local("Gabriola Regular"), local("Gabriola"),
        url("Gabriola.eot"),                        /* IE 5+ */
        url('Gabriola.woff') format('woff'),        /* FF 3.6, Chrome 5, IE9 */
        url('Gabriola.ttf') format('truetype'),     /* Opera, Safari */
        url('Gabriola.svg#Gabriola') format('svg'); /* iOS */
}
body {
    font-family: Gabriola, sans-serif;
    font-size: 1.3em;
}
.wine_name { font-size:2em; }
.price { font-size:2.6em; color:#CCC; }
.sugar { font-size:2em; color:#980000; }
br { page-break-after: always; }

页面显示很快，因为我已经安装了 Gabriola。当我删除 local() 引用时，文件下载......但 Firefox 在最终呈现页面之前冻结了大约 20 秒。这是因为多个字体大小声明。当我删除它们时，无论我是否指定 local() 源，它都会快速呈现。有其他人遇到过这个问题吗？

Answer 1

也许我很不耐烦，但我最近似乎在回答自己的问题很多：S

结果要么 A) 字体文件本身有问题和/或 B) Firefox 不擅长解析某些类型的字体...

我下载了不同的脚本字体（akaDora）并对其进行了测试……它工作得很好。没有滞后。没有延迟。当然，现在我的任务是为 Gabriola 查找不会使 Firefox 出错的字体文件。有人认识他们吗？我从http://www.fonts2u.com/ 测试了这两种字体。