page-break-***: ***;

Browser
  • IE
  • Cr
  • Sf
  • Fx
  • O

The page-break-*** property sets the page-breaking behavior before or after an element.
(*** = before or after)

  • page-break-before : The page-breaking behavior before an element.
  • page-break-after : The page-breaking behavior after an element.

hr {
page-break-after: always;
}
Property Value Explanation
page-break-before auto inserts a page break before the element as necessary
always always inserts a page break before the element
avoid avoids inserting a page break before the element
page-break-after auto inserts a page break after the element as necessary
always always inserts a page break after the element
avoid avoids inserting a page break after the element

For example :

h2 { page-break-before: always; } : Inserts a page break before the h2 heading.
hr { page-break-after: always; } : Inserts a page break after the horizontal rule.

Example


<html>
<head>
<title>TAG index</title>

<style type="text/css">

h2 {
page-break-before: always;
}

</style>

</head>
<body>

<h1>The page break example</h1>
<p>This is the first page.</p>
<p>(The position of the page break can be confirmed by the browser's print preview.)</p>
<hr>

<h2>The second page</h2>
<h3>Example</h3>
<p>This is the second page.</p>
<hr>

<h2>The third page</h2>
<h3>Example</h3>
<p>This is the third page.</p>
<hr>

</body>
</html>
Output
Example pagenew window