10
votes

@ Font-face ne figure pas correctement dans IE

Je cherche des heures, j'ai demandé des amis et cela n'a pas fonctionné. J'espère donc que vous pourrez m'aider. Mon site Web utilise une police personnalisée, mais c'est-à-dire (10) ne supporte pas cela sur la manière dont je le fais. Je ne sais pas qu'il soutient d'autres méthodes. Voici le mien:

    <!--[if IE]>
      <link rel="stylesheet" type="text/css" href="<?php echo get_stylesheet_directory_uri() ?>/style/ie.css" />
    <![endif]-->


1 commentaires

Pour rendre la question significative aux futurs visiteurs, vous devez inclure un code complet d'une démo dans la question ou fournir une URL raisonnablement permanente d'une démonstration en ligne qui sera pas être réparée (c'est-à-dire que le problème est supprimé. ) déjà.


6 Réponses :


17
votes

Formats de caractères multiples

Pour prendre en charge une large gamme de navigateurs, utilisez un .ttf, .woff et . eot la version de la police. xxx

Vous pouvez utiliser un site Web de conversion de police comme Squirrel de police , pour convertir le .ttf police en .woff et .EOT

DRM faux positif

Comme @jukka a souligné, il existe un problème juridique avec le fichier TTF qui l'empêche d'être utilisable sous Windows. Dans la console de développeur IE, le message d'erreur suivant s'affiche: xxx

Shardee semble être une police abandonnée avec un Type de licence inconnu . Bien que cela puisse être légal d'utiliser cette police, Windows semble exiger que chaque fichier TTF ait des informations DRM qui indiquent explicitement qu'il est légal de l'intégrer dans des pages Web. L'erreur dans IE est probablement un faux positif.

Pour tester cela, j'ai pris une police TTF qui est connue pour être légalement licenciée pour une utilisation sur des sites Web. La version TTF n'a pas fonctionné dans IE à cause de l'erreur DRM. Cet exemple est définitivement un faux positif. C'est l'une des raisons pour lesquelles il est nécessaire d'utiliser plusieurs formats de polices et de pourquoi un format unique comme TTF ne fonctionnera pas sur tous les navigateurs.

Bien que Windows ne permet pas d'utiliser le fichier TTF, c'est-à-dire peut toujours utiliser la version Woff ou Eot. Quand j'ai testé la règle de la police sur un serveur Web local, à l'aide des trois formats de police, la police Shardee rendue correctement dans toutes les versions de IE (bien qu'avec un message d'erreur dans la console de développeur IE) .

étapes pour essayer:

  1. Convertir le .ttf fichier sur .woff et .EOT
  2. Téléchargez le .woff et .Eot dans le même répertoire que le fichier .ttf .
  3. Remplacez le @ Font-face règle avec celui ci-dessus. J'ai corrigé quelques fautes de frappe dans la version initiale de celle-ci.

    Si vous avez toujours un problème, il peut y avoir un problème avec les paramètres du serveur Web. Question connexe: IE9 Blocks Télécharger la police Web d'origine transversale


4 commentaires

Merci d'avoir répondu. Mais cela n'a pas fonctionné. Il travaille dans Chrome et Mozilla (et bien plus de navigateurs que je n'ai pas installé). Mais ne fonctionne pas dans IE 10. Peut-être que je fais quelque chose de mal, mais je n'ai aucune idée de ce qui devrait être.


@Bartroelofs: j'ai mis à jour la réponse avec des informations supplémentaires et une règle Font-face Mise à jour qui a fonctionné correctement dans toutes les versions de IE sur un serveur Web local utilisant la police Shardee.


Ajoutez éventuellement des fichiers .svg pour prendre en charge iOS 4.1 et plus tôt.


@MattCoughlin Merci pour l'aide, je reçois aussi ce message d'erreur sur la console. Les polices que j'utilise sont nombreuses. Et ils travaillent bien, quand je publie une application en local. Mais quand je télécharge la même application et le soleil de là, cela ne fonctionne pas bien.



2
votes

Donc, le problème est apparemment que sur IE 10, le menu, à l'intérieur de l'élément avec ID = MENU , n'apparaît pas dans la police déclarée "shardee" mais dans la police par défaut du navigateur. Cela rend le menu lisible. Mais techniquement, l'explication peut être vue dans les outils de développeur (appuyez sur F12 pour les entrer), dans le volet de la console. Le message d'erreur, avec code CSS3114, indique que @ font face-face n'a pas transmis les chèques de droits d'utilisation pour l'encreur.

Vérifiez les droits d'utilisation de la police et contactez le titulaire du droit d'auteur (qui doit être présumé être des idées brillantes) pour obtenir les droits si possible.


0 commentaires

2
votes

FONTPREP est un excellent générateur de polices Web pour Mac OS X. Il créera même des fonts.css


0 commentaires

0
votes

J'ai couru dans ce même problème et a couru F12. Il semble que la compatibilité a été activée dans IE10 pour le site que j'étais sur. Une fois que j'ai désactivé la compatibilité Visionner la police personnalisée affichée. J'espère que cela aide quelqu'un ...


0 commentaires

3
votes

IE11: Si vous recevez le code d'erreur CSS3114 dans Dev Outils, vous devez modifier les premiers bits du fichier de police. Cela permettra d'installer la police.

Module NPM: Vous pouvez utiliser TTEMED-JS NPM Module, qui apportera les modifications pour vous. https://www.npmjs.com/package/ttembed-js

Utilisation: TTEMEDBED-JS PATH / to / SHARDEE.TTF


1 commentaires

C'était la meilleure solution pour moi!



3
votes

En recherchant sur le Web, j'ai trouvé cet outil en ligne qui effectue une solution sur la police TTF, ce qui le rend affiche à l'explorateur: https://www.andrebacklund.com/fontfixer.html


0 commentaires