Wie kann ich Seitenumbrüche beim Google Chrome-Drucken zuverlässig erzwingen?-CSS-Tutorial-php.cn

Wie kann ich Seitenumbrüche beim Google Chrome-Drucken zuverlässig erzwingen?

Patricia Arquette

Freigeben： 2024-12-10 02:29:12

Original

923 Leute haben es durchsucht

How Can I Reliably Force Page Breaks in Google Chrome Printing?

Seitenumbrüche beim Google Chrome-Drucken

Trotz gegenteiliger Behauptungen ist die Meldung „Seitenumbruch nach: immer;“ Die CSS-Eigenschaft erzwingt häufig keine Seitenumbrüche in Google Chrome. Um dieses Problem anzugehen, sollten Sie einen robusteren Ansatz in Betracht ziehen, der sich in allen gängigen Browsern, einschließlich Chrome, als effektiv erwiesen hat.

Die vorgeschlagene Lösung umfasst die Erstellung einer benutzerdefinierten CSS-Regel für Druckmedien, die die „page“-Klasse zur Steuerung der Seite verwendet bricht. Der folgende Codeausschnitt veranschaulicht diesen Ansatz:

<!DOCTYPE html>

<html>
  <head>
    <meta http-equiv="content-type" content="text/html;charset=UTF-8" />
    <title>Paginated HTML</title>
    <style type="text/css" media="print">
      div.page {
        page-break-after: always;
        page-break-inside: avoid;
      }
    </style>
  </head>
  <body>
    <div class="page">
      <h1>This is Page 1</h1>
    </div>
    <div class="page">
      <h1>This is Page 2</h1>
    </div>
    <div class="page">
      <h1>This is Page 3</h1>
    </div>
  </body>
</html>

Nach dem Login kopieren

Durch die Verwendung der „page“-Klasse gewährleistet diese Methode eine präzise Kontrolle über Seitenumbrüche innerhalb des Dokuments. Jede Instanz des „page“-Div stellt eine separate Seite dar, was beim Drucken zu zuverlässigen Seitenumbrüchen führt. Diese Lösung ist besonders nützlich für paginierte Dokumente, bei denen jede Seite bestimmte Elemente enthalten sollte.

Das obige ist der detaillierte Inhalt vonWie kann ich Seitenumbrüche beim Google Chrome-Drucken zuverlässig erzwingen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!