0

こんにちは、@Font-Face で少しジレンマを抱えていて、その理由がわかりません。私は、使用するのに最適な @font-face コードについて無数の時間をかけて調査し、Mac OS X ブラウザーで表示されない理由についてトラブルシューティングを行いました。

現在の状況は、私が使用している...

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

結果のページは次のように表示されます...

*Windows OS - すべてのブラウザー (Chrome、Firefox、IE) で動作します

*Apple Mac OS X - Firefox および Safari 6.x では動作しますが、Chrome または Safari 5.x では動作しません

*Apple iOS iPhone および iPad - 正常に動作

この件に関するガイダンスをいただければ幸いです。

自分で確認したい場合は、 http: //gradtouch.com/testをご覧ください。

なぜそれがうまくいかないのか、私はとても混乱しています。前もって感謝します。

4

1 に答える 1

2

問題はttfファイルにあり (ファイルが破損しています。ベースラインが変更され、フォントが大幅にトリミングされているように見えます)、それが原因でこの動作が発生します。他の形式 (eot、woff、svg) を提供するブラウザーは問題なく動作しttfますが、ブラウザーが提供することを選択すると、空白のページが表示されます (ただし、技術的にはエラーはありません)。ファイルを修正すれば準備完了です。

これはあなたのwoffファイルです： ここに画像の説明を入力

そして、これはあなたのttfファイルです： ここに画像の説明を入力

于 2013-03-07T12:14:12.463 に答える