- <html>
- <head>
- <title></title>
- <style type="text/css">
- p.page {
- page-break-before:always;
- }
- </style>
- </head>
- <body>
- <p>페이지 1</p>
- <p class="page">페이지 2</p>
- <p class="page">페이지 3</p>
- <p class="page">페이지 4</p>
- <body>
- </html>
프린트 할 때 페이징을 해야 하는 경우가 있다.
뭐 많진 않겠지만 가끔 우리 클라이언트 샛퀴들처럼 300개 가까이 되는 신청서 한꺼번에 인쇄되게 해 달라고 하는 찐따들이 있다.
그런 찐따들을 달래기 위한 게 아닌가 싶다.
사설은 닥치고
코드만 봐도 충분히 이해가 갈 듯하다.
그냥 css 한 줄이면 충분하다.
위 코드를 html 페이지에서 그냥 보면
페이지 1
페이지 2
페이지 3
페이지 4
이렇게만 보이지만 '인쇄 미리 보기'를 하게 되면 페이지가 정상적으로 나누어져 나온다.
FF, IE6에선 정상적으로 확인했지만 IE7에선 아래와 같은 버그(?)가 있습니다.
지금 위처럼 텍스트만 있을 경우엔 페이지가 정상적으로 나누어지지만 테이블이 좀 들어갈 경우엔 페이지가 정상적으로 나누어지지 않네요.
'Programming > HTML/CSS' 카테고리의 다른 글
| [IE 전용]CSS로 문자열 자른 후 ... 넣기 (0) | 2010/08/17 |
|---|---|
| font 관련 (0) | 2010/08/16 |
| 프린트 할 때 페이지 나누기 (0) | 2010/03/08 |
| 테이블 사이즈 고정하기 (4) | 2009/04/09 |
| 백그라운드 이미지 정렬(?) (0) | 2008/11/20 |
| CSS Hack (0) | 2008/09/22 |
댓글을 달아 주세요