Frage

Wie oben beschrieben, habe ich Probleme mit @ font-face nicht in IE9 anzeigt, obwohl es in Ordnung zeigt in jedem anderen Browser einschließlich IE8 und unter. Darüber hinaus, wenn sie lokal auf meinem Computer sehen, tut IE9 die Schrift angezeigt werden, nur nicht, wenn sie vollständig zu Hause sind.

Die Seite ist:

bigwavedesign.co.uk/gcc/gcc/

Der verwendete Code ist:

    @font-face {
                font-family: 'LeagueGothicRegular';
                src: url('league_gothic_0-webfont.eot');
                src: local('League Gothic Regular'), url('league_gothic_0-webfont.woff') format('woff'), url('league_gothic_0-webfont.ttf') format('truetype'), url('league_gothic_0-webfont.svg#webfonta36nFpyE') format('svg');font-weight: normal;font-style: normal;
}

Wer irgendwelche Ideen, warum dies geschieht werden könnte?

Cheers!

=============================================

EDIT

Ich habe die folgende Website, dass zeigt die gleiche Schriftart ok in IE9 gefunden, irgendwelche Ideen anyine, wie er das getan?

http://iamthomasbishop.com/

War es hilfreich?

Lösung

Keine Antwort, nur eine Bestätigung: Ich habe eine ähnliche Art von Problem. Font funktioniert in allen anderen IE-Versionen außer IE9, beide mit IETester und Original-Browser. Beim Ändern Dokumentmodus (F12 dev Tools) Schriftart funktioniert. Nicht, wie Ich mag würde es aber.

Aktualisieren : Mit einigen Tricks schaffte ich es zum Laufen zu bringen. Scheint, wie IE9 ist die mit .woff Version der Schrift (die ich ausgeschlossen hatte) über die .eot , dass ich dachte, es würde. Ich benutzen den @ font-face-Generator von smiley -local. Haben Sie nicht meine .htaccess-Datei zu ändern. Jetzt funktioniert gut und sieht gleich in allen IE-Versionen:

@font-face {
  font-family: "LucidaFax-bold";
  src: url("_font/LucidaFax-bold.eot");
  src: local("☺"),
  url("_font/LucidaFax-bold.woff") format("woff"),
  url("_font/LucidaFax-bold.ttf") format("truetype"),
  url("_font/LucidaFax-bold.svg#LucidaFax-bold") format("svg");
  }

h1 { font-family: "LucidaFax-bold", serif;}

( Ich selbst verrückt frisch mit Mark "Tarquin" Wilton-Jones' text-shadow Hack, als Rest der Browser-Welt der alten Schule gleichen Blick auf IE-Versionen der Anwendung Schaut es war es wert Nun, viel gelernt ,.?!?).

Andere Tipps

Ich hatte gerade das gleiche Problem mit Web Fonts auf einer IIS7 Website gehostet, wie durch Grillz vorgeschlagen die Frage zu MIME-Typ war nach unten.

Ich habe gewählt „application / octet-stream“ auf der Grundlage zu verwenden, auf die Antworten auf die Mime geben Sie für WOFF Frage.

  1. Öffnen Sie IIS und wählen Sie die Seite, dass Hosts die Schriftarten (muss die gleiche Domain-Namen für IE9 und Firefox sein)
  2. Doppelklicken Sie auf "Mime-Typen"
  3. Klicken Sie auf "Hinzufügen ..." in der rechten oberen Ecke.
  4. In "Dateinamenerweiterung:" enter ".woff"
  5. In "MIME-Typ:" enter "application / octet-stream"

WOFF MIME Type Screenshot

Hoffnung, dass jemand spart 10 Minuten in der Zukunft.

Für uns war der Trick, um nur das Format ändern auf den .eot Dateien sind dienen wir auf.

Arbeiten in IE6-9, Firefox 4.3, Chrome, Safari, Android, iPhone.

@font-face {
    font-family: 'Museo';
    src: url('/ui/museo300.eot?') format('eot'),
         url('/ui/museo300.ttf')  format('truetype')
}

Wird:

@font-face {
    font-family: 'Museo';
    src: url('/ui/museo300.eot?') format('embedded-opentype'),
         url('/ui/museo300.ttf')  format('truetype')
}

Meine Lösung ist, zwei verschiedene Schriftarten zu deklarieren:

@font-face {
    font-family: "Dereza bold";
    src: local("Dereza bold"), url("../../assets/otf/dereza_bold.otf") format("opentype"); 
}

@font-face {
    font-family: "IE Dereza bold";
    src: url("../../assets/eot/dereza_bold.eot");
}

Und dann:

.divclass {
  font-family: "Dereza bold", "IE Dereza bold";
}

Abalore 1

Meine Lösung:

@font-face {
    font-family: "OfficinaSansBookSCC";
    src: url('font/OfficinaSansBookSCC.eot'); 
    src: url('font/OfficinaSansBookSCC.eot') format('embedded-opentype'), 
         url( 'font/OfficinaSansBookSCC.ttf' ) format("truetype");
} 

Arbeiten in IE 7-9, Chrome, Opera, Firefox.

erste Zeile benötigt für IE 9, die zweite für IE 08.07.

Nun, da Sie Ihren Beitrag die folgenden Text wird nicht die Antwort bearbeitet haben. Verweisen Sie auf das richtige Verzeichnis? Jede Chance, dies eine Mime-Typ Ausgabe vom Server zu sein?

=============================================== =====

Das könnte es sein:

  

Es ist wichtig zu beachten, dass Ihre Website in documentMode 9, um die Vorteile der neuen Funktionen mit IE9 (das beinhaltet alle neuen Funktionen in IE9, nicht nur die, die im Zusammenhang mit Web-Schriften) enthalten nehmen machen müssen. Wenn Sie nicht von documentMode gehört vor, Microsoft hat zusammen eine Führung setzen, die erklärt, was es ist und wie Sie es auf Ihrer Website verwenden können.

http: / /blog.typekit.com/2010/09/03/typekit-adds-experimental-support-for-ie9/

In IE9 - F12 Blick auf den Debug-Fenster sehen, ob es irgendwelche CSS3117 Fehler sind. Siehe auch: IE9 Blöcke Download von Cross-Origin-Web-Schriftart

Font Squirrel bietet auch ein wunderbares Generator Tool, um Ihnen einen Font-Kit erstellen, dass werden die erforderlichen Formate umfassen, bereits geschriebene CSS, und sogar, wie eine Demo-Seite zu sehen, es ist alles verwendet, zusammen mit Hilfe bei Problemen beim Betrieb auftreten können.

Es war eine Brise seine Ausgabe in meiner Seite zu integrieren und es hat das Problem perfekt beheben.

Sie sollten überprüfen diesen Blogeintrag Paul Irish hat eine einige Dinge, über die Probleme zu sagen, Sie über kommen und er kommt mit dem, was er nennt eine ‚kugelsichere‘ @ font-face-Anweisung.

http://paulirish.com/2009/bulletproof-font-face -Implementierung-Syntax /

http://www.fontsquirrel.com verwendet diese für die Probe CSS die OK für das Projekt, das ich gearbeitet arbeitet.

@font-face {
    font-family: 'QuicksandBook';
    src: url('/Quicksand_Book-webfont.eot');
    src: url('/Quicksand_Book-webfont.eot?#iefix') format('embedded-opentype'),
         url('/Quicksand_Book-webfont.woff') format('woff'),
         url('/Quicksand_Book-webfont.ttf') format('truetype'),
         url('/Quicksand_Book-webfont.svg#QuicksandBook') format('svg');
    font-weight: normal;
    font-style: normal;
}

hatte ich dieses Problem. Stellt sich heraus, ich war ein Komma in der font-family Deklaration fehlt.

Ich wollte noch eine andere Sache hinzufügen, die möglicherweise in diesem Szenario schief gehen könnte. IE9 hat eine Regel, dass verwirft alle @ font-face Erklärungen, die nicht nach der ersten Belastung zwischengespeichert werden können. IE9 wird tatsächlich nutzt die Schriftart korrekt auf der ersten Anzeige, aber auf nachfolgende Aktualisierungen, wird die @ font-face deaktiviert sein. Ich entdecken diese nach meinem Browser zufällig schließen und erneuten Öffnen dann zu finden, dass meine Schrift auf mysteriöse Weise arbeitet, nur zu stoppen, später eine Auffrischung arbeiten.

Um dies zu beheben, können Sie einfach Notwendigkeit, um sicherzustellen, dass der Antrag im Dienst Ihre Schrift einen Cache-Control Antwort-Header von etwas anderes als no-cache hat. Ich würde empfehlen, es max-age=3600 Einstellung. Dadurch wird sichergestellt, Ihre Schriftart für eine Stunde zwischengespeichert wird. IE9 wird dann in der Lage sein, Ihre Schrift konsequent angezeigt werden soll.

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top