私の @font-face が Firefox で動作しないのはなぜですか?

CSS @font-face が Firefox で機能しない: クロスドメインおよびローカル ホスティングの問題の解決

Firefox は、定義されたカスタム フォントのレンダリングに特殊性を示します@font-face ルールを使用する（特に HTML および CSS ファイルがローカルまたは別の場所にある場合）

ローカル ホスティング (file:///)

Firefox は、ローカル ファイル アクセス (file:///) に対して厳格なオリジン ポリシーを適用します。これを解決するには:

• Firefox のアドレス バーで about:config に移動します。
• 「fileuri」でフィルターし、「security.fileuri.strict_origin_policy」を false に切り替えます。

これにより、Firefox はドキュメント パスに関係なくローカル フォント リソースにアクセスできるようになります

公開サイト

公開 Web サイトでも問題が解決しない場合は、次のことを検討する価値があります。

• アクセス制御の追加.htaccess 内の .ttf、.otf、および .eot ファイルへのAllow-Originヘッダーファイル:

<FilesMatch "\.(ttf|otf|eot)$">
    <IfModule mod_headers.c>
        Header set Access-Control-Allow-Origin "*"
    </IfModule>
</FilesMatch>

• または、base64 でフォント書体をエンコードします (ただし、美観のために推奨されません)。

追加情報

この問題の包括的な概要については、次を参照してください。リンク:

• [Firefox の CSS クロスオリジン フォント](https://developer.mozilla.org/en-US/docs/Glossary/Prefetch#Cross-origin_font_loading)
• [クロスドメイン フォントを有効にするFirefox](https://stackoverflow.com/questions/19223013/enable-cross-domain-fonts-in-firefox)

以上が私の @font-face が Firefox で動作しないのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。