CSS page-break-after property
The page-break-after property used to add a page-break after a specified element.we cannot use this property on an empty <div> or on absolutely positioned elements.
CSS Syntax:
page-break-after: auto|always|avoid|left|right|initial|inherit;
Property Values:
- auto : Automatic page-break.
- always: Page-break after the element.
- avoid : Page-break after the element.
- left : The next page is formatted as a left page.
- right : The next page is formatted as a right page.
- initial : Property to its default value.
- inherit : Property from its parent element.
Example :
<html> <head> <style type = "text/css"> div{ font-size: 20px; page-break-after: auto; } </style> </head> <body> <div> <h2>Hello World!!</h2> <h2>Welcome to the I2Tutorials</h2> </div> <div> Enter content here. Enter content here. Enter content here. Enter content here. Enter content here. Enter content here. Enter content here. Enter content here. Enter content here. Enter content here. </div> <br> <button onclick = "func()">Print this page</button> <script> function func() { window.print(); } </script> </body> </html>
OUTPUT: