Maison > interface Web > tutoriel CSS > Pourquoi ma déclaration @font-face affiche-t-elle un type MIME incorrect dans Chrome ?

Pourquoi ma déclaration @font-face affiche-t-elle un type MIME incorrect dans Chrome ?

Susan Sarandon
Libérer: 2024-10-25 22:28:02
original
835 Les gens l'ont consulté

Why does my @font-face declaration display an incorrect MIME type in Chrome?

La déclaration 'font-face' affiche un type MIME incorrect dans Chrome

Lors de l'utilisation de la déclaration @font-face ci-dessous :

<code class="css">@font-face {
    font-family: SolaimanLipi;
    src: url("font/SolaimanLipi_20-04-07.ttf");
}</code>
Copier après la connexion

elle fonctionne parfaitement dans Firefox mais échoue dans Chrome. Lors de l'inspection de l'élément, le message suivant apparaît :

Resource interpreted as font but transferred with MIME type application/octet-stream.
Copier après la connexion

Pour résoudre ce problème de compatibilité entre navigateurs, considérez la déclaration polyvalente @font-face suggérée par Paul Irish :

<code class="css">@font-face {
  font-family: 'Graublau Web';
  src: url('GraublauWeb.eot');
  src: local('☺'),
         url('GraublauWeb.woff') format('woff'), url('GraublauWeb.ttf') format('truetype');
}</code>
Copier après la connexion

Cette déclaration s'adresse à différents navigateurs en proposant :

  • .eot pour Internet Explorer
  • .woff ou .ttf pour les autres navigateurs

Pour générer ces polices types de la source d'origine, utilisez le générateur de polices de caractères de Font Squirrel.

De plus, ajoutez un fichier .htaccess pour définir les types de polices :

AddType application/vnd.ms-fontobject .eot
AddType font/ttf .ttf
AddType font/otf .otf
AddType application/x-font-woff .woff
Copier après la connexion

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!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal