Wie steuere ich Ränder beim HTML-Druck mithilfe eines separaten Stylesheets?

Randkontrolle beim HTML-Druck

Beim Anpassen des Drucklayouts einer HTML-Seite ist es wichtig, die Ränder zu kontrollieren, um eine ordnungsgemäße Formatierung sicherzustellen auf Papier. Bei dieser Frage geht es darum, den rechten und linken Rand mithilfe eines separaten Stylesheets festzulegen, das für den Druck bestimmt ist.

Um beim Drucken eine genaue Randkontrolle zu erreichen, ist es wichtig, absolute Einheiten wie Zentimeter (cm) oder Millimeter (mm) zu verwenden. Pixel hingegen können aufgrund der Browserinterpretation zu inkonsistenten Rändern führen. Daher gewährleistet die Angabe der Ränder wie folgt Konsistenz:

<code class="css">body {
  margin: 25mm 25mm 25mm 25mm;
}</code>

Ebenso empfiehlt es sich für Schriftgrößen, für Printmedien Punkte (pt) zu verwenden.

Es ist wichtig, diese Einstellung zu beachten Die Verwendung von CSS-Rändern verändert weder die Randeinstellungen des Druckertreibers noch die vom Browser gesteuerten Ränder. Stattdessen werden die Ränder innerhalb des druckbaren Bereichs des Dokuments angepasst.

Für mehr Flexibilität bei der Definition von Papierrändern sollten Sie die @page-Direktive verwenden. Dieser Ansatz wirkt sich auf die Ränder außerhalb des HTML-Body-Elements aus und ermöglicht so eine präzise Steuerung der gedruckten Ausgabe. Hier ist ein Beispiel:

<code class="css">@page {
  size: auto;
  margin: 25mm 25mm 25mm 25mm;
}

body {
  margin: 0px;
}</code>

Es ist jedoch erwähnenswert, dass ältere Versionen von Internet Explorer die Druckgrößen möglicherweise automatisch anpassen, was möglicherweise zu Störungen der Randeinstellungen führt. Um dies zu verhindern, sollten Benutzer in der Druckvorschau die Druckgröße mit 100 % angeben.

Das obige ist der detaillierte Inhalt vonWie steuere ich Ränder beim HTML-Druck mithilfe eines separaten Stylesheets?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!