图标字体在 Firefox 中不可见答案

【问题标题】：Icon-font not visible in firefox图标字体在 Firefox 中不可见
【发布时间】：2013-01-26 21:35:59
【问题描述】：

我用@fontface 添加了一个iconfont。唯一的问题是，它在 Firefox 下是不可见的。我有最新版本的火狐。 Safari 和 Chrome 运行良好。

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

【问题讨论】：

标签： css wordpress firefox browser icon-fonts

【解决方案1】：

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

对于字体套件生成，您可以使用：

【讨论】：

那么解决方案是什么？代码看起来与问题中的相同，除了顺序，在这里应该无关紧要，不是吗？

【解决方案2】：

试试这个：

@font-face {
    font-family: 'iconFont';
    src: url('../fonts/iconFont.eot');
    src: url('../fonts/iconFont.eot') format('embedded-opentype'), url('../fonts/iconFont.svg') format('svg'), url('../fonts/iconFont.woff') format('woff'), url('/fonts/iconFont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

避免使用速记字体格式

@font-face
{
font-family: myFirstFont;
src: url('Sansation_Light.ttf'),
     url('Sansation_Light.eot'); /* IE9 */
}

【讨论】：