1

レスポンシブ Web サイトで、Web 用の WOFF および EOT フォント形式に付属する購入した Web フォントを使用しようとしています。言うまでもなく、フォーマットは Android を含むすべてのデバイスで動作する必要があります。

私は開発者と協力しており、WOFF と EOT はそのようなデバイスではサポートされていないと言っています。

私の質問は、typekit を介してホストできる場合、これは違いがありますか?

4

2 に答える 2

3

デフォルトの Android ブラウザが WOFF または EOT フォントをサポートしていないというあなたの指摘は正しいです。Android デバイスで広くサポートされている唯一のフォント形式は TTF/OTF です。Android の一部の新しい (3.0 以降) ビルドでは、SVG フォントもサポートされます。通常、Web フォントには、WOFF、EOT、および TTF/OTF の 3 つの主要な形式がすべてパッケージ化されています。これら 3 つのファイル タイプは、CSS で正しい @font-face とともに使用すると、現在使用されているほぼすべてのデバイス/ブラウザでフォントが正しく動作することが保証されます。

Web フォントには、3 つの主要なファイル形式すべてが付属している必要があります。そうでない場合は、 Font Squirrel Webfont Generatorなどのツールを使用して取得できます。typekit を介したホスティングも解決策を提供する場合がありますが、自分で変換を行う場合とは異なり、typekit は場合によっては無料ではありません。

于 2013-10-12T03:11:51.730 に答える
-3

この実装を試してください

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

h1 {
  font-family: 'OpenSans';
  font-weight: 300%;
}

詳細については、この例をチェックしてください https://github.com/ttivensky/BulletProof-font-face-implementation

于 2014-01-27T10:03:40.193 に答える