css - Webfont 以不同方式加载跨浏览器(mac firefox 问题)

Question

我使用此代码为博客使用谷歌“Comfortaa”字体

<link href='http://fonts.googleapis.com/css?family=Comfortaa&subset=greek,latin' rel='stylesheet' type='text/css'>

但是，该字体(连同其他字体)在 mac Firefox 上显示得更粗(在 Chrome mac/win firefox win 等上显示良好)

为了确定，我将所有 em 都更改为 px，而且我可以使用代码尝试使用 font squirrel

/* Generated by Font Squirrel (http://www.fontsquirrel.com) on November 2, 2012 */



@font-face {
    font-family: 'comfortaabold';
    src: url('comfortaa-bold-webfont.eot');
    src: url('comfortaa-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('comfortaa-bold-webfont.woff') format('woff'),
         url('comfortaa-bold-webfont.ttf') format('truetype'),
         url('comfortaa-bold-webfont.svg#comfortaabold') format('svg');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'comfortaalight';
    src: url('comfortaa-light-webfont.eot');
    src: url('comfortaa-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('comfortaa-light-webfont.woff') format('woff'),
         url('comfortaa-light-webfont.ttf') format('truetype'),
         url('comfortaa-light-webfont.svg#comfortaalight') format('svg');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'comfortaaregular';
    src: url('comfortaa-regular-webfont.eot');
    src: url('comfortaa-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('comfortaa-regular-webfont.woff') format('woff'),
         url('comfortaa-regular-webfont.ttf') format('truetype'),
         url('comfortaa-regular-webfont.svg#comfortaaregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

问题仍然存在。(我不太确定将@font face 放在哪里 - 我通过 blogger css 应用了它)

我是不是做错了什么，或者这显然是一个无法修复的浏览器渲染问题？

Answer 1

尝试使用数字字体粗细值。在 Google webfont listening 中，您可以看到每种样式的正确字体粗细。就 Comfortaa 而言，它们是:{font-weight: 300;} 用于书籍，{font-weight: 400;} 用于普通，{font-weight: 700;} 用于粗体。