Wie kann ich beim Drucken von Dokumenten mit window.print() Kopf- und Fußzeilen eliminieren?

Kopf- und Fußzeile in gedruckten Dokumenten mit window.print() eliminieren

Das Standardverhalten der Funktion window.print() umfasst das Drucken eine Kopf- und Fußzeile, die seitenbezogene Informationen wie Titel, Pfad, Nummer und Datum anzeigt. Das Entfernen dieser Elemente kann die Druckästhetik verbessern.

Beim Versuch, die Kopf- und Fußzeile mit einem Druck-Stylesheet zu unterdrücken, sind Sie auf Schwierigkeiten gestoßen. Es gibt eine wirksame Lösung zur Behebung dieses Problems.

In Google Chrome können Sie die automatische Kopf-/Fußzeile deaktivieren, indem Sie den folgenden Code in Ihr CSS integrieren:

@page { margin: 0; }

Indem Sie die Ränder auf festlegen Null, der gedruckte Inhalt reicht nahtlos bis an die Grenzen der Seite, sodass keine Kopf- oder Fußzeile erforderlich ist. Um zu verhindern, dass der Inhalt den Seitenrand erreicht, geben Sie in Ihrem Textelement entsprechende Ränder und Abstände an:

@media print {
  @page { margin: 0; }
  body { margin: 1.6cm; }
}

Achtung: Bei mehrteiligen Inhalten, die mehrere Seiten erfordern, kann dieser Ansatz zu ästhetischen Mängeln führen. Nur die erste und die letzte Seite haben die vorgesehenen Ränder, während auf den Zwischenseiten sowohl der obere als auch der untere Rand fehlen.

Diese Lösung war zum Zeitpunkt dieser Antwort (Mai 2013) zwar in Chrome wirksam, erfordert jedoch möglicherweise weitere Schritte Testen der Kompatibilität mit anderen Browsern. Wenn eine browserübergreifende Unterstützung unerlässlich ist, bleibt das Erstellen einer PDF-Datei im Handumdrehen und deren Drucken (möglicherweise mit eingebettetem selbstdruckendem JavaScript) eine machbare, aber arbeitsintensive Alternative.

Das obige ist der detaillierte Inhalt vonWie kann ich beim Drucken von Dokumenten mit window.print() Kopf- und Fußzeilen eliminieren?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!