웹페이지 인쇄 영역 나누기 - CSS page-break

HTML 웹페이지를 인쇄할 경우 어디까지가 출력이 되는지 구분이 잘 안 되는데, 아래 Tag를 통해 인쇄 영역을 나눌 수 있다.

 

CSS page-break 속성들

• page-break-after
• page-break-before 
• page-break-inside

 

CSS page-break 옵션 (page-break-after 및 page-break-before)

옵션	설명
auto	Default. Automatic page-break
always	Always insert a page-break after the element
avoid	Avoid a page-break after the element (if possible)
left	Insert page-break after the element so that the next page is formatted as a left page
right	Insert page-break after the element so that the next page is formatted as a right page
initial	Sets this property to its default value.
inherit	Inherits this property from its parent element.

 

 

사용 예

<p style="page-break-before:always"></p>

 

이렇게 하면 p태그를 기준으로 출력 페이지를 넘긴다.

 

 

 

 

상세 설명은 W3C School에서 확인

 

https://www.w3schools.com/cssref/pr_print_pageba.php

CSS Page-break-after Property