HTML 페이지 나누기 ,인쇄영역 나누기

2013. 1. 11. 15:50WEB/HTML



반응형

HTML 소스를 사용하여 인쇄영역(페이지)를 나누는 방법. 페이지 분리.

아래에서는 div를 사용하여 block-level element를 지정했지만

<p>, <span>, <br> 태그를 사용해도 됩니다.

 


.

.

.

 


출력할 내용1

<div style='page-break-before:always'></div>    <!--여기를 기준으로 앞의 내용이 한 페이지-->

 

 

출력할 내용2

<div style='page-break-before:always'></div>    <!--여기를 기준으로 앞의 내용이 한 페이지-->

.

.

.

 

 

출력할 내용을 지정한 블록마다 페이지가 설정되어 페이지 나누기를 할 수 있습니다.

 


page-break-before와 page-break-after, page-break-inside가 있습니다.

대체적으로 page-break-before를 사용합니다.

page-break-before는 이 엘리먼트가 나오기 전까지의 문자를 한 페이지로 구분합니다.

page-break-after는 이 엘리먼트가 나온 이 후의 문자를 한 페이지로 구분합니다.

 


각 속성의 의미(대체적으로 always만 사용함)

auto     -    자동으로 계산하도록 지정

always -    뒤에서 항상 분리하도록 지정

avoid    -    뒤에서 절대 분리되지 않도록 지정

left       -    뒤에서 분리된 페이지가 왼쪽 면에 위치하도록 지정

right     -    뒤에서 분리된 페이지가 오른쪽 면에 위치하도록 지정

inherit   -    부모 요소의 값을 상속하도록 지정

 

 

반응형