Heim >Web-Frontend >CSS-Tutorial >Wie kann ich Kopf- und Fußzeilen entfernen, wenn ich „window.print()' verwende?
Kopf- und Fußzeile aus „window.print()“ entfernen
Wenn Sie window.print() zum Drucken einer Seite verwenden, können Sie dies tun Es tritt ein Problem mit Kopf- und Fußzeilen auf, bei denen Seitendetails wie Titel, Pfad, Seitenzahl und Datum angezeigt werden. Diese können ablenken und die gewünschte Druckausgabe beeinträchtigen.
Um dieses Problem zu beheben, wurde eine Lösung gefunden, die im Chrome-Browser wirksam ist (ab Oktober 2022 funktioniert sie auch in Firefox). Durch die Verwendung des folgenden Stylesheets können Sie die automatische Kopf- und Fußzeile, die Chrome generiert, unterdrücken:
@page { margin: 0; }
Dieses Stylesheet setzt die Seitenränder auf Null, wodurch der Inhalt bis zu den Rändern der Seite reicht. Dadurch werden Kopf- und Fußzeile, die normalerweise außerhalb des druckbaren Bereichs angezeigt werden, effektiv ausgeblendet.
Um zu verhindern, dass der Inhalt über die Seitengrenzen hinausragt, empfiehlt es sich, Ränder oder Abstände für das Seitenelement festzulegen :
@media print { @page { margin: 0; } body { margin: 1.6cm; } }
In diesem Beispiel wird oben und unten auf der Seite ein Rand von 1,6 cm angebracht, um sicherzustellen, dass der Inhalt innerhalb der Druckvorlage bleibt
Es ist wichtig zu beachten, dass diese Lösung möglicherweise kein optimales Ergebnis liefert, wenn der Inhalt zu groß ist und mehrere Seiten erfordert. Nur die erste Seite hat einen oberen Rand und nur die letzte Seite hat einen unteren Rand. Zwischenseiten haben keine Ränder, was möglicherweise nicht wünschenswert ist.
Wenn Sie Browser unterstützen müssen, die dieses Stylesheet nicht effektiv verarbeiten, können jedoch alternative Lösungen wie das Erstellen und Drucken einer PDF-Datei im laufenden Betrieb erforderlich sein Die Implementierung dieser Methoden kann komplex und zeitaufwändig sein.
Das obige ist der detaillierte Inhalt vonWie kann ich Kopf- und Fußzeilen entfernen, wenn ich „window.print()' verwende?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!