Wie vermeide ich unerwünschte leere Seiten bei der Verwendung von Seitenumbrüchen in HTML und CSS?

Unerwünschte leere Seiten beim Drucken vermeiden

In HTML und CSS können Seitenumbrüche mithilfe der Befehle „page-break-after“ und „page-break-after“ gesteuert werden. Break-before-Eigenschaften. Allerdings kann die Verwendung dieser Eigenschaften manchmal zu zusätzlichen leeren Seiten vor oder nach dem beabsichtigten Umbruch führen.

Zum Beispiel druckt der folgende Code eine zusätzliche leere Seite nach dem Inhalt aufgrund von page-break-after: Always;:

<code class="html"><div class="print" style="page-break-after: always;">fd</div>
<div class="print" style="page-break-after: always;">fdfd</div></code>

Um dieses Problem zu verhindern, sollten Sie die folgende Lösung in Betracht ziehen:

<code class="css">@media print {
    html, body {
        height: 99%;    
    }
}</code>

Diese CSS-Regel reduziert effektiv die Höhe der HTML- und Body-Elemente auf 99 %, wodurch der Browser daran gehindert wird Hinzufügen einer zusätzlichen leeren Seite nach dem Inhalt.

Das obige ist der detaillierte Inhalt vonWie vermeide ich unerwünschte leere Seiten bei der Verwendung von Seitenumbrüchen in HTML und CSS?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!