Pourquoi mon CSS @font-face ne fonctionne-t-il pas dans Firefox ?

CSS @font-face ne s'affiche pas dans Firefox

Bien qu'elle fonctionne correctement dans Google Chrome et Internet Explorer, la règle CSS @font-face ne fonctionne pas dans Firefox. Bien que le code @font-face semble valide, le problème semble être spécifique à Firefox. Pour résoudre cet écart, vous devez comprendre la configuration et les paramètres de Firefox.

Politique d'URI de fichier local

Firefox applique une politique stricte concernant l'origine des URI de fichiers (file:///). , ce qui peut gêner le chargement des ressources locales. Pour résoudre ce problème, accédez à « about:config » dans la barre d'adresse de Firefox, filtrez par « fileuri » et basculez la préférence « security.fileuri.strict_origin_policy » sur false. Cela permet à Firefox de se comporter de la même manière que les autres navigateurs lors de la gestion des ressources de polices locales.

Problèmes inter-domaines

Si le site est publié et que le problème persiste, il se peut que Il est nécessaire de prendre en compte un problème potentiel inter-domaines. Même si des chemins relatifs sont spécifiés dans le code, il est recommandé d'ajouter un en-tête supplémentaire dans le fichier .htaccess :

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

Cet en-tête devrait empêcher toute restriction potentielle entre domaines. De plus, il est possible d'utiliser le codage base64 pour la police de caractères, ce qui peut également résoudre le problème.

Pour plus d'informations et un aperçu complet, reportez-vous à la ressource fournie dans la réponse.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!