Fehlerbehebung bei Problemen bei der Schriftart in Firefox
Ich habe auf Schwierigkeiten gestoßen, eine lokale Oswald Woff -Schriftart in Firefox zu laden, obwohl es in Chrome und IE9 korrekt funktioniert. Die Registerkarte "Browser -Netzwerk" enthüllte hängende und abgebrochene Anforderungen.
Warum woff?
WOFF (Web -Open -Schriftformat) bietet mehrere Vorteile:
Debuggen des Firefox -Problems
@font-face
Mozillas Dokumentation über Woff war nicht hilfreich. Bei der Behauptung von Firefox 3.6 unterstützt meine Implementierung WOFF über .htaccess
. Vorschläge zum Definieren eines MIME -Typs in Apache AddType application/x-font-woff .woff
Datei (caniuse.com
) und das Hinzufügen von Caching -Headern haben das Problem nicht behoben. url(fonts/GenR102.ttf) format("truetype")
und das Mozilla Hacks -Blog zeigten ebenfalls WOFF -Unterstützung an, was die Verwirrung weiter erhöhte. Das Hinzufügen einer TTF -Fallback -Schriftart (.htaccess
), wie in anderen Beiträgen vorgeschlagen, erwies sich ebenfalls als unwirksam. Das Laden von JavaScript (mithilfe von Google Web -Schriftarten -API) funktionierte, ließ jedoch noch hängende Anforderungen für die lokal angegebenen Schriftarten. Das Hinzufügen weiterer MIME -Typen in
Die CSS:
@font-face
Mein CSS enthielt separate
@font-face { font-family: 'Oswald'; font-style: normal; font-weight: 700; src: local('Oswald Bold'), local('Oswald-Bold'), url(http://jquery4u.com/wp-content/themes/jquery4u/css/fonts/oswald/bH7276GfdCjMjApa_dkG6T8E0i7KZn-EPnyo3HZu7kw.woff) format('woff'); } @font-face { font-family: 'Oswald'; font-style: normal; font-weight: 300; src: local('Oswald Light'), local('Oswald-Light'), url(http://jquery4u.com/wp-content/themes/jquery4u/css/fonts/oswald/HqHm7BVC_nzzTui2lzQTDT8E0i7KZn-EPnyo3HZu7kw.woff) format('woff'); } @font-face { font-family: 'Oswald'; font-style: normal; font-weight: 400; src: local('Oswald Regular'), local('Oswald-Regular'), url(http://jquery4u.com/wp-content/themes/jquery4u/css/fonts/oswald/-g5pDUSRgvxvOl5u-a_WHw.woff) format('woff'); } /* custom font */ h1 { font-family: 'Oswald', sans-serif; }
Die verbleibenden Anfragen waren wahrscheinlich auf die Behandlung mehrerer WOFF -Dateien durch Firefox für verschiedene Schriftgewichte zurückzuführen. Weitere Untersuchungen sind erforderlich, um die genaue Ursache zu bestimmen.
häufig gestellte Fragen zu Woff -Schriftarten
(Dieser Abschnitt bleibt gegenüber der ursprünglichen Eingabe unverändert, da es sich um einen separaten FAQ -Abschnitt handelt und für den Kontext des Problems der Fehlerbehebung nicht umschreiben muss.)
WOFF oder Web Open -Schriftart ist ein Web -Schriftformat, das von Mozilla, Typus und Letterror entwickelt wurde. Es ist eindeutig, da es eine komprimierte Version der gleichen tabellbasierten SFNT-Struktur verwendet, die von TrueType, Openentype und OTF verwendet wird, aber Datenstrukturen für private Nutzung hinzufügt. Auf diese Weise können Schriftarten kleiner sein und auf Webseiten schneller laden. Im Gegensatz zu anderen Formaten wird WOFF von allen großen Browsern unterstützt.
Die Konvertierung Ihrer Schriftarten in WOFF kann mit Online -Tools wie Transfonter oder Font Squirrel -Generator durchgeführt werden. Sie laden einfach Ihre Schriftart hoch, wählen die Formate aus, in die Sie konvertieren möchten, und laden Sie die konvertierten Dateien herunter. Denken Sie daran, die Lizenzierung Ihrer Schriftarten vor dem Konvertieren zu überprüfen, da einige möglicherweise keine Konvertierung oder Webnutzung zulassen.
Wenn Ihre Woff -Schriftarten in Firefox nicht korrekt angezeigt werden, kann dies aus einigen Gründen liegen. Überprüfen Sie zunächst, ob die Schriftart in Ihrem CSS ordnungsgemäß geladen ist. Wenn dies der Fall ist, löschen Sie Ihren Browser -Cache oder überprüfen Sie, ob die Schriftart durch den Tracking -Schutz von Firefox blockiert wird. Wenn das Problem bestehen bleibt, kann es auf einen Fehler in der Darstellung von Woff -Schriftarten durch Firefox zurückzuführen sein.
Um WOFF-Schriftarten in Ihrer Website zu verwenden, müssen Sie sie zunächst in Ihrem CSS über die @font-Face-Regel deklarieren. Anschließend können Sie die Eigenschaft Schriftfamilie verwenden, um die Schriftart auf Elemente auf Ihrer Seite anzuwenden. Denken Sie daran, Fallback -Schriftarten aufzunehmen, falls die WOFF -Schrift nicht geladen wird.
Woff -Schriftarten werden von allen modernen Browsern, einschließlich Chrome, Firefox, Safari und Edge, häufig unterstützt. Für ältere Versionen dieser Browser oder anderer weniger häufiger Browser müssen Sie jedoch Fallback -Schriftarten in Ihr CSS aufnehmen.
ob Sie WOFF -Schriftarten für kommerzielle Projekte verwenden können, hängt von der Lizenzierung der Schriftart ab. Einige Schriftarten sind für den persönlichen und kommerziellen Gebrauch kostenlos, während andere möglicherweise eine Lizenz für die kommerzielle Nutzung benötigen. Überprüfen Sie immer die Lizenzinformationen, bevor Sie eine Schriftart für Ihre Projekte verwenden.
Woff -Schriftarten haben mehrere Vorteile. Sie sind kleiner Größe, was bedeutet, dass sie auf Webseiten schneller laden. Sie werden auch von allen großen Browsern unterstützt, was sie zu einer zuverlässigen Wahl für das Webdesign macht. Darüber hinaus können WOFF-Schriftarten Metadaten und Datenstrukturen für private Nutzung umfassen, die für Schriftarten und Benutzer nützlich sein können.
Um WOFF -Schriftarten für eine bessere Leistung zu optimieren, können Sie eine Schriftunterbrechung verwenden, um nur die von Ihnen benötigten Zeichen hinzuzufügen. Dies reduziert die Dateigröße der Schriftart und wird so schneller geladen. Sie können auch Schriftladungsstrategien wie Schriftart oder die Schriftladungs-API verwenden, um zu steuern, wie Schriftarten auf Ihrer Seite geladen und angezeigt werden.
Ja, Sie können Ihre eigenen Woff -Schriftarten erstellen. Sie können Ihre eigene Schriftart mit Software wie Fontforge oder Glyphen entwerfen und sie dann mit einem Online -Tool oder einer Online -Software in WOFF konvertieren. Denken Sie daran, die Kompatibilität und Leistung Ihrer Schrift in verschiedenen Browsern zu überprüfen.
WOFF2 ist die zweite Version des Web -Open -Schriftformats. Es bietet eine bessere Komprimierung als WOFF, was zu kleineren Dateigrößen und schnelleren Ladezeiten führt. Es ist jedoch nicht so weit verbreitet wie WOFF, daher müssen Sie möglicherweise eine WOFF -Version Ihrer Schrift als Fallback einfügen.
Das obige ist der detaillierte Inhalt vonWarum hängen Woff -Schriftarten in Firefox?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!