Pourquoi est-ce que je reçois « La ressource interprétée comme une police mais transférée avec une application/octet-stream de type MIME » dans Chrome lorsque j'utilise @font-face ?

Type MIME incorrect pour @font-face dans Chrome

Lors de la tentative d'implémentation d'une police personnalisée à l'aide de la déclaration @font-face dans Chrome , les développeurs peuvent rencontrer un message d'erreur indiquant « Ressource interprétée comme police mais transférée avec une application/un flux d'octets de type MIME. » Ce problème provient d'une inadéquation entre le type MIME du fichier de police et le type attendu spécifié dans la déclaration.

Pour résoudre cet écart, une déclaration @font-face complète peut être utilisée pour répondre aux différentes exigences du navigateur. . La déclaration multi-navigateurs suivante garantit la compatibilité avec Chrome et Firefox :

<code class="css">@font-face {
  font-family: 'Font Name';
  src: url('FontName.eot');
  src: local('☺'),
         url('FontName.woff') format('woff'), url('FontName.ttf') format('truetype');
}</code>

Le fichier .eot est conçu pour Internet Explorer, tandis que d'autres navigateurs utilisent les formats .woff ou .ttf. Pour générer ces différents formats à partir de votre police source, envisagez d'utiliser le générateur de polices de caractères de Font Squirrel.

De plus, un fichier .htaccess doit être configuré pour spécifier les types MIME pertinents pour les fichiers de police :

<code class="htaccess">AddType application/vnd.ms-fontobject .eot
AddType font/ttf .ttf
AddType font/otf .otf
AddType application/x-font-woff .woff</code>

En suivant ces recommandations, vous pouvez vous assurer que votre police personnalisée s'affiche correctement dans différents navigateurs, y compris Chrome.

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!