Javascript traditionelle print() Methode Stil kommt nicht in der Druckansicht

Question

ich einen Drucktisch Code Geige haben LINK

meinen Code überprüfen:

function printData() 
{ 
    var divToPrint=document.getElementById("printTable"); 
    console.log(divToPrint.outerHTML); 
    newWin= window.open(""); 
    newWin.document.write(divToPrint.outerHTML); 
    newWin.print(); 
    newWin.close(); 
} 

ich hinzugefügt haben background-color zu, dass so rot wie Sie sehen können in Geige. Ich habe versucht, es zu drucken. Aber im Druck kommt die Farbe nicht und alle anderen Dinge funktionieren gut. Ich habe über @media print recherchiert und alles, aber nicht in der Lage, es zu knacken. Bitte führe mich und eine aktualisierte Geige wird großartig sein, die du mir geben kannst. Prost!

Answer 1

Browser neigen Hintergrundfarben und Bilder deaktivieren standardmäßig. Überprüfen Sie Ihre Browser-Druckoptionen für einen „Druckhintergrundfarben“ Option oder ähnliches, zum Beispiel in Chrome:

• im Druckdialog, klicken Sie auf „+ Weitere Einstellungen“ am unteren Rand der linken Spalte
• Markieren Sie das „Hintergrundgrafik“ -Box
• die Druckvorschau jetzt sollten Sie zeigen die Hintergrundfarbe

Firefox zwei Optionen unter „drucken Backgrounds“ zu haben scheint auf der Registerkarte „Optionen“ des Druckdialog:

• "Hintergrundfarben drucken"; und
• "Print Background Images"

Bitte beachte, dass ich Ubuntu bin mit; Der spezifische Wortlaut und der Speicherort dieser Optionen können je nach Betriebssystem und Browser variieren. Einige Browser haben möglicherweise keine Option dafür, einfach alle Hintergrundfarben/Bilder für den Druck zu entfernen.

Ich glaube nicht, dass Sie diese Optionen aus dem JS/CSS/HTML-Code erzwingen können; Es liegt immer beim Benutzer, zusammen mit anderen Druckoptionen.

Answer 2

Die meisten Browser drucken keine Hintergrundfarben oder Bilder. Einige haben benutzergesteuerte Einstellungen dafür, aber Sie können nicht auf Hintergründe zählen, es liegt beim Benutzer (wenn der Browser es sogar erlaubt).

Getrennt: Ihr neues Fenster wird nicht jede explizite Styling in Ihrem Beispiel haben, wenn es im Inneren des printTable Element ist, wie Sie ein ganz eigenes Fenster mit völlig getrennten Inhalt sind die Erstellung und so keines Das Styling der aktuellen Seite wird vererbt.

---

die technisch ungültig wäre, style und link nicht außerhalb head erlaubt, aber ich habe es nie wirklich bekannt, um ein Problem