Font Awesome Icons werden nur in Schwarz gedruckt

8

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.

    
Wellspring 29.03.2015, 03:13
quelle

3 Antworten

9

Es stellt sich heraus, dass das Objekt, das Sie tatsächlich benötigen, nicht das i selbst ist, sondern das :before Element. Also:

%Vor%     
owensmartin 06.04.2016, 22:22
quelle
7

Wenn Sie Bootstrap verwenden, müssen Sie dessen CSS bearbeiten, da es eine schwarze Farbe für "@media print"

angibt     
Stan 13.05.2015 15:17
quelle
0

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:

%Vor%
    
Andy Seitz 07.04.2015 23:00
quelle