4

我有一个项目使用 font-face 一段时间没有问题。今天我检查了字体不能在 firefox v14 和 v15 上工作，可证明也不能在 v12+ 上工作，就像这个线程中的情况一样：http: //css-tricks.com/forums/discussion/17337/font-face-problem- with-firefox-v-12/p1 我的问题和上一个线程完全一样。

总结一下。我正在使用字体来加载这样的网络字体：

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

进而

#bea .bea {
    font-family: 'TradeGothicLTStdCnBold';
    font-size: 14px;
}

根据萤火虫正确加载字体。它适用于 safari、chrome、IE 和一些 firefox。我已经尝试了 6 个 firefoxs (v13-15)，它在其中一些中有效，而在另一些中无效。我无法确定任何原因。

我还查找了 firefox 配置值 gfx.font_rendering.cleartype.always_use_for_content；而且我注意到在我测试的所有Firefox中都设置为false，即使是那些正常工作的。

现场示例： http ://comoquierascolacao.com/jovenestalentos/

它应该是什么样子： http: //postimage.org/image/n2r9fxdsv/它应该是什么样子

总结一下： - 路线有效。- 路由在同一个域中，没有跨域问题。- 它在某些 Firefox 中确实有效，而在其他 Firefox 中则无效（我没有理由弄清楚）。- 它之前在我自己的 Firefox 中确实有效，可能在 v12 之前。

谢谢大家，任何帮助将不胜感激，因为这让我发疯。

4

4 回答 4

3

嗯，我的错。毕竟这是一个跨域问题。www.domain...即使在访问http://domain... 将所有人重定向到 www.domain时加载的字体也应该可以解决问题，我认为从现在开始将是一个好习惯。另一种解决方案是使用相对路径加载字体。

于 2012-09-13T07:57:34.257 回答
3

我对 FF 没有正确显示字体有同样的问题。以下是可能遇到此问题的人的解决方法：

尝试在块的末尾声明“eot”字体。像：

@font-face {
font-family: 'TradeGothicLTStdCnBold';
src: url('/jovenestalentos/fonts/tradegothicltstd-bdcn20-webfont.woff') format('woff'),
     url('/jovenestalentos/fonts/tradegothicltstd-bdcn20-webfont.ttf') format('truetype'),
     url('/jovenestalentos/fonts/tradegothicltstd-bdcn20-webfont.svg#TradeGothicLTStdCnBold') format('svg');
src: url('/jovenestalentos/fonts/tradegothicltstd-bdcn20-webfont.eot');
src: url('/jovenestalentos/fonts/tradegothicltstd-bdcn20-webfont.eot?#iefix') format('embedded-opentype');
font-weight: normal;
font-style: normal;
于 2012-12-15T11:10:55.993 回答
1

JavaScript 控制台（Herramientas-> Desarrollador web-> Consola de errores）显示几个错误：

Fecha y hora: 13/09/2012 9:41:37
Advertencia: downloadable font: no supported format found (font-family: "TradeGothicLTStdCnBold" style:normal weight:normal stretch:normal src index:4)
source: (end of source list)
Archivo de origen: http://www.comoquierascolacao.com/jovenestalentos//style/style.css?v=1
Línea: 0
Código fuente:
@font-face {   font-family: "TradeGothicLTStdCnBold";   font-style: normal;   font-weight: normal;   src: url("/jovenestalentos/fonts/tradegothicltstd-bdcn20-webfont.eot?#iefix") format("embedded-opentype"), url("/jovenestalentos/fonts/tradegothicltstd-bdcn20-webfont.woff") format("woff"), url("/jovenestalentos/fonts/tradegothicltstd-bdcn20-webfont.ttf") format("truetype"), url("/jovenestalentos/fonts/tradegothicltstd-bdcn20-webfont.svg#TradeGothicLTStdCnBold") format("svg"); }
于 2012-09-13T07:42:55.580 回答
1

我的解决方案：在带有 www 的域上。一切正常，但没有 www。FF问题出现了。所以我使用重定向到www。在 .httaccess 中：

RewriteEngine on
RewriteCond %{HTTP_HOST} ^example\.com$ [NC]
RewriteRule ^(.*)$ http://www.example.com/$1 [R=301,L]

它有效！谢谢韩诺

于 2013-08-15T12:49:47.463 回答