Question

我的网站上安装了两个网络字体，一个正在使用Firefox，而另一个则没有。如果您在Chrome上进行检查，则两种Google网络字体都可以完美呈现。这是我的代码：

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

}

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

}

网站为http://www.journeytoearth.com/

提前感谢任何帮助和解决方案。

Answer 1

看起来“UnitSlabProBlack”的@ font-face src属性是绝对链接的，而你的“UnitSlabProLight”src属性是相对于root的。

我建议尝试更改UnitSlabProBlack src格式以匹配“UnitSlabProLight”的格式，因为那个有效。

看起来Firefox只接受src的相对链接： http://webfonts.info/wiki/index.php?title=%40font-face_support_in_Firefox

来自http://www.journeytoearth.com/wp-content/themes/melville/style.css

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


@font-face {
font-family: 'UnitSlabProBlack';
src: url('http://www.journeytoearth.com/fonts/unitslabpro-black-webfont.eot');
src: url('http://www.journeytoearth.com/fonts/unitslabpro-black-webfont.eot?#iefix') format('embedded-opentype'),
     url('http://www.journeytoearth.com/fonts/unitslabpro-black-webfont.woff') format('woff'),
     url('http://www.journeytoearth.com/fonts/unitslabpro-black-webfont.ttf') format('truetype'),
     url('http://www.journeytoearth.com/fonts/unitslabpro-black-webfont.svg#UnitSlabProBlack') format('svg');
font-weight: normal;
font-style: normal;}

我的一个Web字体无法在Firefox上呈现

1 个答案: