web-dev-qa-db-ja.com

WOFFとEOTしか持っていない場合、@ font-faceでサポートしているブラウザーは何ですか?

提供されている形式(WOFFおよびEOT)でのみWeb上で使用できるフォントの購入を検討しています。

私はそれらがどのブラウザで動作するかわからないし、最新の情報を見つけることができないようです。これら2つだけでどのブラウザをサポートできますか?

私の唯一の経験は、EOT、WOFF、TTF、およびSVGを持つfontspringの構文です。

16
erik

これが @ font-faceを使用した標準的なロード方法 であり、ハッキングの修正などすべてです!!

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

ただし、SVGを削除すると失われます iOS <5.0のほぼ完全なサポート

使用できます には優れたテーブルがあります ブラウザサポート全般EOT に別の、 WOFF に別の、さらに別の SVG があり、最後に TTF があります。わかりやすくするために下に挿入しました。これはテスト対象を案内するはずですが、これは非常に急速に変わることを念頭に置いてください。

wyによる編集サポートを表示できるようにテーブルをコンパイルしました side by side

@ font-faceブラウザのサポート全般

@font-face browser support generally

EOTブラウザのサポート

EOT browser support

WOFFブラウザのサポート

WOFF browser support

SVGブラウザのサポート

SVG browser support

TTFブラウザのサポート

TTF browser support

23
toomanyairmiles

Webfontベンダーは本当にフォントのeotサポートを提供する必要があります-特にこのためです!これは、クラウドベースの場合でも(含めるか除外するかのオプションがある)、これが2番目の性質であると思うでしょう。 @ eb_p1

1
eburnett

SVGは@ font-faceを使用してどこにもアクセスしません。ただし、EOTはIEでサポートされています。 TTFとOTFは、他のすべての主要なブラウザーでサポートされています。 WOFFについては、TTFやOTFに類似しているため、TTFやOTFと同じブラウザーでサポートされている可能性が高いです。私の提案は、あなたが本当に興味があるなら、ブラウザで各@ font-face拡張機能を試して、何を取得するかを確認し、それをW3Cに送信して@ font-face記述子の標準ページを更新します。 (現在のところ、「安全な」フォント拡張機能も含まれていません)。

他のすべてが失敗した場合、私はW3Schoolsが最新であることをかなり確信しています: http://www.w3schools.com/cssref/css3_pr_font-face_rule.asp

1
Jeff Langemeier