css: page-break-before:always und page-break-after:always werden angezeigt-CSS-Tutorial-php.cn

css: page-break-before:always und page-break-after:always werden angezeigt

黄舟

Freigeben： 2018-05-15 09:48:40

Original

5059 Leute haben es durchsucht

Die CSS-Eigenschaften

page-break-before und page-break-after ändern nicht die Anzeige der Webseite auf dem Bildschirm. Diese beiden Eigenschaften werden zur Steuerung verwendet Drucken der Datei. Für jedes Druckattribut können 4 Einstellungswerte festgelegt werden: automatisch, immer, links und rechts. Unter diesen ist „Auto“ der Standardwert. Sie müssen das Symbol „Seitenumbruch“ (Seitenumbrüche) nur bei Bedarf festlegen. Wenn „page-break-before“ auf „Immer“ eingestellt ist, startet der Drucker eine neue Druckseite, wenn er auf eine bestimmte Komponente trifft. Wenn page-break-before auf left gesetzt ist, werden Seitenumbruchsymbole eingefügt, bis die angegebene Komponente auf einer linken leeren Seite erscheint. Wenn page-break-before auf right gesetzt ist, werden Seitenumbrüche eingefügt, bis die angegebene Komponente auf einer leeren Seite rechts erscheint. Das Attribut „page-break-after“ fügt das Seitenumbruchsymbol nach der angegebenen Komponente ein, nicht davor. Im folgenden Verfahren können Sie die Einstellungen dieser Eigenschaften sehen. Das Obige ist das Ergebnis von BaiduDer rote Absatz: Wenn eine bestimmte Komponente gefunden wird, startet der Drucker eine neue Druckseite

Worauf bezieht sich diese bestimmte Komponente?

Was ist der andere Unterschied zwischen den beiden?

Der folgende Code wurde ebenfalls übergeben, der Effekt in der Druckvorschau ist derselbe

<HTML>
 
<HEAD>
 
<TITLE>Listing 14-4</TITLE>
 
</HEAD>
 
<BODY>
 
<DIV>This is the first DIV.</DIV>
 
<DIV STYLE="page-break-before:always">This is the second DIV.</DIV>
 
<DIV STYLE="page-break-after:always">This is the third DIV.</DIV>
 
<DIV>This is the fourth DIV.</DIV>
 
<DIV STYLE="page-break-before:right">This is the fifth DIV.</DIV>
 
<DIV STYLE="page-break-after:right">This is the sixth DIV.</DIV>
 
<DIV>This is the last DIV.</DIV>
 
</BODY>
 
</HTML>

Nach dem Login kopieren

vorher dient zum Einfügen des Seitenvorschubzeichens vor dem

Boxmodell

und

danach hinten. Sie können 1.html

und 2.html

<style>
h2{page-break-after: always;}
</style>
1
<h2>---这个在前1页---</h2>
2
<h2>---这个在前2页---</h2>

Nach dem Login kopieren

zum Testen verwenden und Sie werden sehen, dass der Druckeffekt unterschiedlich ist

<style>
h2{page-break-before: always;}
</style>
1
<h2>---这个在前2页---</h2>
2
<h2>---这个在前3页---</h2>

Nach dem Login kopieren

Das Der intuitivste Weg besteht darin, Beispiele zum Verständnis zu verwenden.

Beachten Sie, dass CSS definiert, ob Zeilenumbrüche vor h2 oder nach h2 eingefügt werden sollen

CSS Sie können es selbst ausprobieren und die Wirkung sehen.

Das obige ist der detaillierte Inhalt voncss: page-break-before:always und page-break-after:always werden angezeigt. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!