@ Font-face-Deklaration in CSS funktioniert nicht

StackOverflow https://stackoverflow.com/questions/562524

  •  05-09-2019
  •  | 
  •  

Frage

Ich helfe meiner Schwester eine Website konvertieren, dass jemand für sie in Flash in HTML hat.

Sie nutzen ausgefallene Schriftarten im Flash, die ich in einer CSS-Datei durch @ font-face zu definieren versuchen. Ich habe versucht, die Seite in Firefox, IE und Chrome zu öffnen, aber nirgendwo habe ich die richtige Schrift zu sehen.

Die Erklärung, die ich benutze ist: 

@font-face {
  font-family: "VAG Rounded";
  src: url("http://judith.huinink.net/chilax/VAGROUNL.OTF");
}

http://judith.huinink.net/chilax/index.htm enthält die hTML.

http://judith.huinink.net/chilax/chilax.css enthält den vollständigen CSS.

Ich habe, dass ich die Font-Datei herunterladen kann, aber es funktioniert einfach nicht die Schriftart verwenden, wenn ich die Seite in einem Browser öffnen. Ich muss mit Blick auf etwas werden. Hat jemand irgendwelche Vorschläge?

War es hilfreich?

Lösung

Aktualisieren

Im letzten Jahr, Browser-Unterstützung für Schriften verbessert hat ziemlich dramatisch. Ich würde vorschlagen, Tim Brown ausgezeichneten Artikel lesen zum Thema , die im Detail beschrieben, wie in den meisten modernen Browsern Web-Fonts erhalten.

Original Antwort

In realistischer ist @font-face vollständig im Augenblick unbrauchbar. Nur zwei Browser es unterstützen -. Internet Explorer für Windows, Version 5 oder höher und Safari 3.1

Schlimmer noch, IE und Safari nicht die gleichen Schriftformate unterstützen. IE unterstützt nur EOT , während Safari statt unterstützt die häufigen Truetype (.ttf) und Opentype ( OTF) Formate.

Andere Tipps

font-face geht Mainstream

Ab Januar 2010 werden alle wichtigen neuen Browser unterstützen font-face

  • Safari 3.1
  • IE - alle Versionen
  • Firefox 3.6
  • Chrome 4
  • Opera 10

Siehe http://webfonts.info/wiki/index.php? title = @ font-face_browser_support

Fast kein Browser unterstützen @ font-face: Wann kann ich ...

Wie @ font-face in allen Browsern verwenden, die es unterstützen: Jon Tangerine Blog

ttf2eot ist ein schöner Schriftart-Konverter für Unix und Windows so müssen Sie nicht auf verwenden, um die schrecklichen alt Microsoft TRESSEN. Er wandelt die ganze Schrift, nicht nur einige Zeichen.

Hier ein Javascript mit sIFR zu verwenden, die sIFR für @ font-face-fähige Browser deaktiviert.

Flash-braucht, um zu sterben, so ist hier eine weitere Alternative zu sIFR: Facelift . Es ist ein serverseitiges Skript, das Bild erzeugt.

Das Problem mit afaik all sIFR Ersatz ist, dass die Auswahl und Kopieren von Text funktioniert nicht funktioniert wirklich - Sie entweder die Auswahl nicht sehen, oder es ist unmöglich, weniger zu wählen als ein Wort oder eine Zeile. Es gibt auch Cufón, die verwendet , so dass es funktioniert nur auf neue Browser, von denen die meisten @ font-face sowieso.

Tu das Richtige, verwenden Sie die State-of-the-art-Technologie jetzt: @ font-face mit TTF oder OTF und Fallbacks für IE und alte Browser. hält vorzugsweise Ihre HTML sauber und diese Fallbacks in separaten Javascript und CSS-Dateien implementieren. Für IE müssen Sie möglicherweise „bedingte Kommentare“ verwenden, wie in meinem ersten Link oben erläutert. Für Browser mit Javascript deaktiviert, geben Sie immer eine Liste von Ersatzschriften mit den Web-Safe-Fonts am Ende.

Überprüfen Sie die beliebten sIFR oder ohne Flash-Abhängigkeit, typeface.js

Ich habe über Situationen kommen, wo WWW muss in der Domäne enthalten sein. Ohne sie würde es nicht funktionieren.

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