C#을 사용하여 HTML PDF에서 페이지 나누기를 추가하거나 제거하는 방법

업데이트됨:12월 14, 2025

Translated

View the article in English

C#에서 IronPDF를 사용하여 HTML을 PDF로 변환할 때 HTML 요소에 page-break-after: always;를 추가하여 PDF 문서의 페이지 나누기를 제어하거나 page-break-inside: avoid;를 사용하여 페이지 나누기를 방지할 수 있습니다.

IronPDF는 PDF 문서 내에서 페이지 나누기를 지원합니다. PDF 문서와 HTML 문서의 주요 차이점 중 하나는 HTML 문서는 스크롤해야 하는 반면 PDF는 여러 페이지로 구성되어 인쇄가 가능하다는 점입니다. HTML 문자열을 PDF로 변환할 때 개발자는 전문적인 문서 품질을 보장하기 위해 페이지 나누기 위치를 정확하게 제어해야 하는 경우가 많습니다.

빠른 시작: HTML을 PDF로 변환할 때 페이지 나누기 구현

IronPDF를 사용하여 페이지 나누기를 포함하여 HTML을 PDF로 변환합니다. 이 예제는 특정 HTML 콘텐츠 뒤에 페이지 나누기를 삽입하여 올바른 페이지네이션을 구현하는 방법을 보여줍니다. 개발자는 page-break-after: always; 스타일을 추가하여 페이지 나누기가 발생하는 위치를 제어할 수 있으므로 결과 PDF 문서의 가독성과 구성이 향상됩니다.

NuGet 패키지 관리자를 사용하여 IronPDF를 설치하세요.

PM > Install-Package IronPdf

다음 코드 조각을 복사하여 실행하세요.

new IronPdf.ChromePdfRenderer()
  .RenderHtmlAsPdf("<html><body><h1>Hello World!</h1><div style='page-break-after: always;'></div></body></html>")
  .SaveAs("pageWithBreaks.pdf");

실제 운영 환경에서 테스트할 수 있도록 배포하세요.

지금 바로 무료 체험판을 통해 프로젝트에서 IronPDF를 사용해 보세요.

30일 무료 체험

### 최소 워크플로우(5단계)

PDF에서 페이지 나누기를 사용하려면 C# 라이브러리를 다운로드하세요.
HTML 문자열에 페이지 나누기를 적용하고 PDF로 변환합니다.
이미지에 페이지 나누기가 발생하지 않도록 하려면 `page-break-inside` 속성에 **`avoid`를** 설정하세요.
표에 페이지 나누기가 발생하지 않도록 표에도 동일한 작업을 수행하십시오.
CSS 레벨에서 스타일을 설정하세요

HTML에서 PDF로 페이지 나누기를 추가하는 방법은 무엇인가요?

HTML에서 페이지 나누기를 만들려면 HTML 코드에 다음을 사용하세요.

<div style="page-break-after: always;"></div>

<div style="page-break-after: always;"></div>

HTML

page-break-after CSS 속성은 HTML을 PDF로 렌더링할 때 페이지네이션을 제어하는 가장 신뢰할 수 있는 방법입니다. 이 속성은 PDF 렌더러에게 이 스타일이 포함된 요소 바로 뒤에 페이지 나누기를 삽입하도록 지시합니다. 사용자 지정 여백 이나 특정 페이지 레이아웃을 사용할 때 페이지 나누기를 통해 콘텐츠가 의도한 위치에 정확하게 표시되도록 할 수 있습니다.

페이지 나누기 후 삽입이 다른 방법보다 더 효과적인 이유는 무엇일까요?

이 예시에서는 HTML에 다음과 같은 표와 이미지가 있는데, 표 뒤에 페이지 나누기를 추가하여 두 개의 별도 페이지에 표시하고 싶습니다. page-break-after 속성은 page-break-before 또는 수동 간격과 같은 대안에 비해 다양한 렌더링 엔진에서 더 일관된 결과를 제공합니다. 복잡한 레이아웃을 가진 새 PDF를 만들 때 이 방법을 사용하면 예측 가능한 페이지 매김이 보장됩니다.

페이지 나누기에 어떤 요소를 사용해야 할까요?

페이지 나누기는 <div>, <section>, <article>와 같은 블록 수준 요소에서 효과적으로 작동합니다. 다양한 HTML 요소에 페이지 나누기 스타일을 적용할 수 있지만, 콘텐츠를 전용 <div> 태그로 감싸는 것이 가장 안정적인 결과를 제공합니다. 이는 특히 페이지 전체에서 일관된 형태로 표시되어야 하는 머리글과 바닥글을 다룰 때 매우 중요합니다.

테이블

<table style="border: 1px solid #000000">
  <tr>
    <th>Company</th>
    <th>Product</th>
  </tr>
  <tr>
    <td>Iron Software</td>
    <td>IronPDF</td>
  </tr>
  <tr>
    <td>Iron Software</td>
    <td>IronOCR</td>
  </tr>
</table>

<table style="border: 1px solid #000000">
  <tr>
    <th>Company</th>
    <th>Product</th>
  </tr>
  <tr>
    <td>Iron Software</td>
    <td>IronPDF</td>
  </tr>
  <tr>
    <td>Iron Software</td>
    <td>IronOCR</td>
  </tr>
</table>

HTML

영상

<img src="/static-assets/pdf/how-to/html-to-pdf-page-breaks/ironpdf-logo-text-dotnet.svg" style="border:5px solid #000000; padding:3px; margin:5px" />

<img src="/static-assets/pdf/how-to/html-to-pdf-page-breaks/ironpdf-logo-text-dotnet.svg" style="border:5px solid #000000; padding:3px; margin:5px" />

HTML

C# 코드에서 페이지 나누기를 구현하는 방법은 무엇인가요?

:path=/static-assets/pdf/content-code-examples/how-to/html-to-pdf-page-breaks-page-break.cs

using IronPdf;

const string html = @"
  <table style='border: 1px solid #000000'>
    <tr>
      <th>Company</th>
      <th>Product</th>
    </tr>
    <tr>
      <td>Iron Software</td>
      <td>IronPDF</td>
    </tr>
    <tr>
      <td>Iron Software</td>
      <td>IronOCR</td>
    </tr>
  </table>

  <div style='page-break-after: always;'> </div>

  <img src='https://ironpdf.com/img/products/ironpdf-logo-text-dotnet.svg'>";

var renderer = new ChromePdfRenderer();

var pdf = renderer.RenderHtmlAsPdf(html);
pdf.SaveAs("Page_Break.pdf");

$vbLabelText $csharpLabel

위 코드는 표가 첫 번째 페이지에, 이미지가 두 번째 페이지에 포함된 2페이지짜리 PDF 파일을 생성합니다.

이미지에서 페이지 나누기를 방지하려면 어떻게 해야 하나요?

이미지나 표 안에서 페이지 나누기가 발생하지 않도록 하려면, 감싸는 DIV 요소에 CSS page-break-inside 속성을 적용하세요. 이 기술은 크롬을 사용하여 HTML을 디버깅할 때 시각적 무결성을 유지하는 데 필수적이며, 이를 통해 PDF가 의도한 대로 정확하게 렌더링되도록 보장합니다.

<div style="page-break-inside: avoid">
    <img src="no-break-me.png" />
</div>

<div style="page-break-inside: avoid">
    <img src="no-break-me.png" />
</div>

HTML

이미지를 DIV 요소로 감싸야 하는 이유는 무엇일까요?

이미지를 DIV 요소로 감싸면 페이지 나누기 동작을 더 효과적으로 제어할 수 있습니다. page-break-inside: avoid 속성은 블록 수준 요소에서 가장 안정적으로 작동합니다. 이미지는 기본적으로 인라인 요소이므로, 이미지를 래핑하면 스타일이 제대로 적용됩니다. 이 접근 방식은 PDF 형식에서도 구조를 유지해야 하는 반응형 CSS 레이아웃을 다룰 때 특히 유용합니다.

이미지 페이지 나누기에서 흔히 발생하는 문제는 무엇인가요?

일반적인 문제로는 이미지가 여러 페이지에 걸쳐 분할되거나, 페이지 경계에서 부분적으로만 렌더링되거나, 캡션 또는 관련 텍스트가 손실되는 경우가 있습니다. 이러한 문제는 이미지가 페이지 하단에 있을 때 자주 발생합니다. page-break-inside: avoid 래퍼를 사용하면 이미지와 컨테이너 전체가 하나의 단위로 다음 페이지로 이동하므로 이러한 문제를 방지할 수 있습니다.

using IronPdf;

// Example showing how to prevent image breaks in a more complex layout
const string htmlWithProtectedImage = @"
<html>
<head>
    <style>
        .no-break { page-break-inside: avoid; }
        .image-container { 
            border: 2px solid #333; 
            padding: 10px; 
            margin: 20px 0;
        }
    </style>
</head>
<body>
    <h1>Product Gallery</h1>
    <p>Our featured products are displayed below:</p>

    <div class='no-break image-container'>
        <img src='product1.jpg' alt='Product 1' />
        <p>Product 1 Description</p>
    </div>

    <div class='no-break image-container'>
        <img src='product2.jpg' alt='Product 2' />
        <p>Product 2 Description</p>
    </div>
</body>
</html>";

var renderer = new ChromePdfRenderer();
var pdf = renderer.RenderHtmlAsPdf(htmlWithProtectedImage);
pdf.SaveAs("ProductGallery.pdf");

using IronPdf;

// Example showing how to prevent image breaks in a more complex layout
const string htmlWithProtectedImage = @"
<html>
<head>
    <style>
        .no-break { page-break-inside: avoid; }
        .image-container { 
            border: 2px solid #333; 
            padding: 10px; 
            margin: 20px 0;
        }
    </style>
</head>
<body>
    <h1>Product Gallery</h1>
    <p>Our featured products are displayed below:</p>

    <div class='no-break image-container'>
        <img src='product1.jpg' alt='Product 1' />
        <p>Product 1 Description</p>
    </div>

    <div class='no-break image-container'>
        <img src='product2.jpg' alt='Product 2' />
        <p>Product 2 Description</p>
    </div>
</body>
</html>";

var renderer = new ChromePdfRenderer();
var pdf = renderer.RenderHtmlAsPdf(htmlWithProtectedImage);
pdf.SaveAs("ProductGallery.pdf");

$vbLabelText $csharpLabel

표에서 페이지 나누기를 피하려면 어떻게 해야 하나요?

위에서 보셨듯이 CSS page-break-inside: avoid를 사용하면 테이블 내의 페이지 나누기를 방지할 수 있습니다. 이 스타일은 테이블 자체보다는 감싸는 태그(DIV)에 적용하는 것이 더 효과적입니다. 이렇게 하면 스타일이 블록 레벨 HTML 노드에 적용됩니다. 포괄적인 HTML을 PDF로 변환하는 튜토리얼을 제작할 때, 가독성을 위해 표 형식을 제대로 지정하는 것이 매우 중요합니다.

테이블 헤더에 `thead`를 언제 사용해야 할까요?

여러 PDF 페이지에 걸쳐 있는 큰 HTML 테이블의 모든 페이지에 테이블 머리글과 바닥글을 복제하려면 테이블 내에서 <thead> 그룹을 사용하십시오.

<thead>
    <tr>
        <th>C Sharp</th><th>VB</th>
    </tr>
</thead>

<thead>
    <tr>
        <th>C Sharp</th><th>VB</th>
    </tr>
</thead>

HTML

<thead> 요소는 표가 여러 페이지에 걸쳐 있을 때 표 머리글이 각 페이지에 반복되도록 합니다. 이는 특히 재무 보고서, 데이터 목록 및 모든 페이지에서 맥락이 필요한 모든 문서에 유용합니다. 초기 설정 및 설치 개요를 위해 IronPDF는 이러한 HTML 표준을 자동으로 처리합니다.

테이블을 DIV로 감싸는 것이 왜 중요할까요?

페이지 나누기 컨트롤이 있는 DIV 요소로 테이블을 감싸면 다음과 같은 몇 가지 이점이 있습니다.

필요한 경우 표 전체가 하나의 단위로 다음 페이지로 이동하도록 합니다.
헤더와 데이터 행이 분리되는 것을 방지합니다.
추가적인 스타일링 및 간격 조절이 가능합니다.
표에 캡션이나 설명을 쉽게 추가할 수 있으며, 추가된 캡션은 표와 함께 유지됩니다.

CSS3 고급 설정에서 페이지 나누기를 제어하는 방법은 무엇인가요?

더욱 세밀한 제어를 위해 thead 그룹 외에도 CSS3를 사용하세요.

<style type="text/css">
    table { page-break-inside:auto }
    tr { page-break-inside:avoid; page-break-after:auto }
    thead { display:table-header-group }
    tfoot { display:table-footer-group }
</style>

<style type="text/css">
    table { page-break-inside:auto }
    tr { page-break-inside:avoid; page-break-after:auto }
    thead { display:table-header-group }
    tfoot { display:table-footer-group }
</style>

HTML

복잡한 레이아웃에 가장 적합한 CSS 속성은 무엇일까요?

복잡한 레이아웃의 경우 여러 CSS 속성을 조합하세요.

page-break-inside: avoid - 요소 분할을 방지합니다.
page-break-after: always - 요소 뒤에 강제로 줄 바꿈을 삽입합니다.
page-break-before: always - 요소 앞에 줄 바꿈을 강제합니다.
orphans 및 widows - 페이지 나누기 시 최소 줄 수를 제어합니다.
break-inside, break-after, break-before - 최신 CSS3 대안

이러한 속성들이 함께 작용하여 적절한 흐름과 가독성을 갖춘 전문가 수준의 PDF 파일을 생성합니다.

페이지 나누기 문제를 어떻게 해결하나요?

페이지 나누기가 예상대로 작동하지 않을 때:

HTML 구조가 유효한지 확인하세요
스타일이 블록 레벨 요소에 적용되었는지 확인합니다.
먼저 간단한 예제로 테스트한 다음, 복잡성을 추가하세요.
브라우저 개발자 도구를 사용하여 계산된 스타일을 검사합니다.
추가적인 제어를 위해 IronPDF의 렌더링 옵션을 활용하는 것을 고려해 보세요.

PDF 렌더링 프로그램에 따라 페이지 나누기를 처리하는 방식이 약간씩 다를 수 있으므로, 모든 시나리오에서 일관된 결과를 얻으려면 특정 사용 사례에 맞춰 테스트하는 것이 중요합니다.

자주 묻는 질문

C#에서 HTML을 PDF로 변환할 때 페이지 나누기를 추가하려면 어떻게 해야 하나요?

IronPDF를 사용하여 페이지 나누기를 추가하려면 `를 삽입하세요.

HTML 코드에서 줄 바꿈이 발생하길 원하는 위치에 `<p>` 태그를 추가하세요. IronPDF의 ChromePdfRenderer는 이 CSS 속성을 인식하여 PDF 문서의 해당 지점에 새 페이지를 생성합니다.

PDF 변환 시 페이지 나누기를 제어하는 데 가장 신뢰할 수 있는 CSS 속성은 무엇입니까?

IronPDF를 사용할 때 가장 안정적인 방법은 `page-break-after: always;` CSS 속성을 사용하는 것입니다. 이 속성은 다양한 렌더링 엔진에서 일관된 결과를 제공하며 변환된 PDF 문서에서 예측 가능한 페이지 매김을 보장합니다.

표나 이미지 안에서 페이지 나누기를 방지하려면 어떻게 해야 할까요?

표나 이미지 내에서 원치 않는 페이지 나누기를 방지하려면 `page-break-inside: avoid;` CSS 속성을 사용하세요. IronPDF를 사용하여 HTML을 PDF로 변환할 때 이 스타일을 적용하면 표와 이미지가 여러 페이지로 나뉘지 않고 한 페이지에 그대로 유지됩니다.

페이지 나누기 스타일과 가장 잘 어울리는 HTML 요소는 무엇일까요?

페이지 나누기는 `와 같은 블록 수준 요소에서 가장 효과적으로 작동합니다.

`, ` `, 그리고 `

IronPDF는 콘텐츠를 전용 `로 감싸는 것을 권장합니다.

HTML을 PDF로 변환할 때 가장 안정적인 결과를 얻으려면 페이지 나누기 스타일이 적용된 요소를 사용하세요.

페이지 나누기를 인라인 스타일 대신 CSS 수준에서 제어할 수 있나요?

네, 인라인 스타일 대신 CSS 수준에서 페이지 나누기 스타일을 설정할 수 있습니다. IronPDF의 렌더링 엔진은 CSS 스타일시트를 완벽하게 지원하므로 CSS 파일에서 페이지 나누기 규칙을 정의하여 더 깔끔하고 유지 관리하기 쉬운 HTML 코드를 작성할 수 있습니다.

페이지 나누기 전 대신 페이지 나누기 후에 사용해야 하는 이유는 무엇인가요?

`page-break-after` 속성은 `page-break-before` 속성에 비해 다양한 렌더링 엔진에서 더욱 일관된 결과를 제공합니다. IronPDF를 사용하여 복잡한 레이아웃의 PDF를 생성할 때 `page-break-after`를 사용하면 더욱 예측 가능하고 안정적인 페이지 매김 동작을 보장할 수 있습니다.

커티스 차우

지금 바로 엔지니어링 팀과 채팅하세요

기술 문서 작성자

커티스 차우는 칼턴 대학교에서 컴퓨터 과학 학사 학위를 취득했으며, Node.js, TypeScript, JavaScript, React를 전문으로 하는 프론트엔드 개발자입니다. 직관적이고 미적으로 뛰어난 사용자 인터페이스를 만드는 데 열정을 가진 그는 최신 프레임워크를 활용하고, 잘 구성되고 시각적으로 매력적인 매뉴얼을 제작하는 것을 즐깁니다.

커티스는 개발 분야 외에도 사물 인터넷(IoT)에 깊은 관심을 가지고 있으며, 하드웨어와 소프트웨어를 통합하는 혁신적인 방법을 연구합니다. 여가 시간에는 게임을 즐기거나 디스코드 봇을 만들면서 기술에 대한 애정과 창의성을 결합합니다.

시작할 준비 되셨나요?

Nuget 다운로드 17,527,568 | 버전: 2026.2 방금 출시되었습니다