Ich entwickle eine Website, die eine Seite drucken soll, die Font Awesome-Icons enthält. Das Problem besteht darin, dass beim Drucken keine Schriftfarbe-Symbole angezeigt werden.
Im Browser erscheinen sie in Farbe, aber wenn die Seite gedruckt wird, sind die Symbole durchgehend schwarz. Gibt es trotzdem, die Font Awesome Icons in Farbe zu drucken? Vielleicht über CSS mit @media print {}?
EDIT: Außerdem entwickle ich in Firefox.
Es stellt sich heraus, dass das Objekt, das Sie tatsächlich benötigen, nicht das i
selbst ist, sondern das :before
Element. Also:
Ich habe einfach ein einfaches HTML-Beispiel mit font-awesome erstellt und es scheint in Chrome und Firefox gut zu funktionieren. Ich sehe das Symbol auf dem Bildschirm in Rot und es wird auch ohne weitere Aktionen in Rot gedruckt. Abgesehen davon ist die Erstellung eines separaten Medien-CSS eine gute Idee, wenn Ihre HTML-Seite dies rechtfertigt, da es eine bessere Benutzererfahrung bietet (die Bildschirmansicht ist nicht immer ideal zum Drucken).
Sind Sie sicher, dass die Druckereinstellung nicht geändert wurde, um nicht in Farbe zu drucken? Ist der Drucker nicht mehr in dieser Farbe und daher standardmäßig wieder schwarz? Hast du es in einem anderen Browser versucht (Chrome, Safari, Opera, IE)?
Hier ist der einfache Code, den ich zum Testen benutzt habe:
Tags und Links html css printing fonts font-awesome