C#でHTMLからPDFへのページ分割を処理する方法

C#でHTML PDFの改ページを追加または回避する

This article was translated from English: Does it need improvement?
Translated
View the article in English

PDF文書内の改ページを管理するには、HTML要素にpage-break-inside: avoid;を使用します。

IronPDFはPDFドキュメント内での改ページをサポートします。 PDFドキュメントとHTMLの主な違いは、HTMLドキュメントはスクロールする傾向があるのに対し、PDFは複数ページで印刷可能である点です。 HTML文字列をPDFに変換するとき、開発者は、プロフェッショナルなドキュメントを保証するために、ページが改行される場所を正確に制御する必要があります。

クイックスタート: HTML から PDF への変換における改ページの実装

IronPDFを使ってHTMLを改ページ付きのPDFに変換します。 この例では、特定のHTMLコンテンツの後に改ページを挿入することで、適切なページ分割を実現しています。 開発者はpage-break-after: always;スタイルを追加することで、改ページが発生する場所を制御し、生成されるPDF文書の可読性と構成を向上させます。 <div> <section> <article> <div> page-break-inside DIV page-break-inside: avoid page-break-inside: avoid DIV <thead> page-break-inside: avoid page-break-after: always page-break-before: always orphans widows break-inside break-after break-before

  1. IronPDF をNuGetパッケージマネージャでインストール

    PM > Install-Package IronPdf
  2. このコード スニペットをコピーして実行します。

    new IronPdf.ChromePdfRenderer()
      .RenderHtmlAsPdf("<html><body><h1>Hello World!</h1><div style='page-break-after: always;'></div></body></html>")
      .SaveAs("pageWithBreaks.pdf");
  3. 実際の環境でテストするためにデプロイする

    今日プロジェクトで IronPDF を使い始めましょう無料トライアル

    arrow pointer


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レンダラーに指示します。 カスタムマージンや特定のページレイアウトで作業する場合、改ページにより、コンテンツが意図した場所に正確に表示されるようにします。

なぜpage-break-afterは他の方法よりも効果的なのですか?

この例では、HTMLにtableの後に改ページを追加して、2つの異なるページにしたいです。 page-break-beforeや手動でのスペーシングのような代替手段と比較して、異なるレンダリングエンジン間でより一貫した結果を提供します。 複雑なレイアウトの新しいPDFを作成する場合、このアプローチによって予測可能なページネーションが保証されます。

改ページにはどの要素を使うべきですか?

改ページは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");
Imports IronPdf

Private Const html As String = "
  <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'>"

Private renderer = New ChromePdfRenderer()

Private pdf = renderer.RenderHtmlAsPdf(html)
pdf.SaveAs("Page_Break.pdf")
$vbLabelText   $csharpLabel

上記のコードは2ページのPDFを生成します:最初のページにimgがあります。

画像の改ページを防ぐにはどうすればよいですか?

画像やtable内での改ページを避けるには、CSS div要素に適用します。 このテクニックは、Chromeで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プロパティはブロックレベル要素で最も確実に動作します。 画像はデフォルトではインライン要素なので、ラップすることでスタイルが適切に適用されるようにします。 このアプローチは、PDFフォーマットで構造を維持する必要があるレスポンシブCSSレイアウトを扱う場合に特に役立ちます。

画像の改ページでよくある問題とは

よくある問題としては、画像がページ間で分割される、ページの境界で部分的にレンダリングされる、キャプションや関連テキストが失われるなどがあります。 このような問題は、画像がページの下部付近にある場合によく発生します。 page-break-inside: avoidラッパーを使用することで、画像全体とそのコンテナが単位として次のページに移動することを保証することで、これらの問題を防ぎます。

:path=/static-assets/pdf/content-code-examples/how-to/html-to-pdf-page-breaks-7.cs
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");
Imports IronPdf

' Example showing how to prevent image breaks in a more complex layout
Const htmlWithProtectedImage As String = "
<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>"

Dim renderer As New ChromePdfRenderer()
Dim pdf = renderer.RenderHtmlAsPdf(htmlWithProtectedImage)
pdf.SaveAs("ProductGallery.pdf")
$vbLabelText   $csharpLabel
Icon Quote related to 画像の改ページでよくある問題とは

私のお気に入りのこの種のライブラリはIronPDFです。PDFファイルの迅速で効率的な操作が可能です。また、PDF/A形式へのエクスポートやPDF文書へのデジタル署名といった多くの貴重な機能も備えています。

Milan Jovanovic related to 画像の改ページでよくある問題とは

Milan Jovanovic

Microsoft MVP

ケーススタディを見る
Icon Quote related to 画像の改ページでよくある問題とは

IronOCRのおかげで私たちは年間$40,000を手作業の処理から節約し、生産性を向上させ、高影響のタスクにリソースを充てることができます。非常にお勧めします。

Brent Matzelle related to 画像の改ページでよくある問題とは

Brent Matzelle

最高技術責任者, OPYN

ケーススタディを見る
Icon Quote related to 画像の改ページでよくある問題とは

IronSuiteは私たちの業務において重要な役割を果たしています。これらは、フロアプランの作成や在庫管理の改善を含め、ビジネス全体の効率を向上させるツールです。

David Jones related to 画像の改ページでよくある問題とは

David Jones

リードソフトウェアエンジニア、Agorus Build

ケーススタディを見る

テーブルの改ページを避けるにはどうすればよいですか?

上記のように、表内での改ページはCSS avoidを使用することで防ぐことができます。 これは、スタイルがブロックレベルのHTMLノードに適用されることを保証するために、表自体ではなくラップするdivに適用するのが良いです。 包括的なHTML to PDFチュートリアルを作成する場合、適切な表組みは読みやすさのために非常に重要です。

テーブルヘッダーにはいつtheadを使うべきですか?

大きなHTMLテーブルが複数のPDFページにわたる際に、各ページにテーブルのヘッダーとフッターを複製するには、テーブル内で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要素でラップすることで、いくつかの利点が得られます。

  • 必要に応じて、表全体が1つのユニットとして次のページに移動するようにします。
  • ヘッダーとデータ行の分離を防ぐ
  • スタイリングとスペーシングのコントロールを追加できます。
  • キャプションや説明文の追加を容易にします。

どのような高度な 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 - エレメントの分割を防ぐ
  • page-break-after - エレメントの後に改ページを強制する
  • page-break-before - エレメントの前に改ページを強制する
  • widows - 改ページ時の最小行数を制御する
  • break-before - 現代のCSS3の代替

これらの特性は、適切なフローと読みやすさを備えたプロフェッショナルなPDFを作成するために連動します。

改ページの問題をトラブルシューティングするにはどうすればよいですか?

改ページが期待どおりに機能しない場合: 1.HTML構造が有効であることを確認する 2.ブロックレベルの要素にスタイルが適用されていることを確認する 3.まず簡単な例でテストし、次に複雑さを加えてください。 4.ブラウザ開発者ツールを使用して、計算されたスタイルを検査する 5.IronPDFのレンダリングオプションを使用することを検討してください。

PDFレンダラーによって改ページの扱いが若干異なる場合があるため、すべてのシナリオで一貫した結果を得るには、特定のユースケースでテストすることが重要であることを忘れないでください。

よくある質問

C# で HTML を PDF へ変換す る 際、 改ページ を追加す る には ど う し ますか。

IronPDFを使用してページ区切りを追加するには、<div style="page-break-after: always;"></div> をHTMLコード内の区切りたい場所に挿入してください。IronPDFのChromePdfRendererはこのCSSプロパティを認識し、そのポイントでPDFドキュメント内に新しいページを作成します。

PDF変換で改ページを制御するために最も信頼できるCSSプロパティは何ですか?

page-break-after: always; CSSプロパティは、IronPDFを使用する際に最も信頼性の高い方法です。このプロパティは、異なるレンダリングエンジン間で一貫した結果を提供し、変換されたPDFドキュメントの予測可能なページネーションを保証します。

表や画像内の改ページを防ぐにはどうすればよいですか?

テーブルや画像内で不要なページ区切りを防ぐには、page-break-inside: avoid; CSSプロパティを使用してください。IronPDFでHTMLをPDFに変換する際、このスタイルはテーブルや画像が複数のページにわたって分割されず、単一ページ内に保たれることを保証します。

改ページスタイルに最適なHTML要素は?

ページ区切りは<div><table><section>のようなブロックレベルの要素で最も効果的に機能します。IronPDFは、HTMLをPDFに変換する際に最も信頼性の高い結果を得るために、ページ区切りスタイルを持つ専用の

要素でコンテンツをラップすることを推奨しています。

インラインスタイルではなく、CSSレベルで改ページを制御できますか?

はい、インラインスタイルではなくCSSレベルで改ページスタイルを設定することができます。IronPDFのレンダリングエンジンはCSSスタイルシートに完全に対応しており、CSSファイルで改ページルールを定義することができます。

なぜpage-break-beforeではなくpage-break-afterを使用する必要があるのですか?

異なるレンダリングエンジン間で一貫した結果を提供する点では、page-break-afterプロパティの方がpage-break-beforeよりも優れています。IronPDFを使用して複雑なレイアウトのPDFを作成する際、page-break-afterはより予測可能で信頼性のあるページネーション動作を保証します。

Curtis Chau
テクニカルライター

Curtis Chauは、カールトン大学でコンピュータサイエンスの学士号を取得し、Node.js、TypeScript、JavaScript、およびReactに精通したフロントエンド開発を専門としています。直感的で美しいユーザーインターフェースを作成することに情熱を持ち、Curtisは現代のフレームワークを用いた開発や、構造の良い視覚的に魅力的なマニュアルの作成を楽しんでいます。

開発以外にも、CurtisはIoT(Internet of Things)への強い関心を持ち、ハードウェアとソフトウェアの統合方法を模索しています。余暇には、ゲームをしたりDiscordボットを作成したりして、技術に対する愛情と創造性を組み合わせています。

準備はできましたか?
Nuget ダウンロード 20,296,129 | バージョン: 2026.7 リリースされたばかり
Still Scrolling Icon

まだスクロールしていますか?

すぐに証拠が欲しいですか? PM > Install-Package IronPdf
サンプルを実行するHTML が PDF に変換されるのを確認します。