HTML PDF にページ区切りを追加または回避

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

IronPDFはPDFドキュメント内での改ページをサポートします。 PDFドキュメントとHTMLの大きな違いの一つは、HTMLドキュメントはスクロールする傾向があるのに対し、PDFは複数ページにわたっており、印刷することができる点です。


PDF 用 C# NuGet ライブラリ

でインストール NuGet

Install-Package IronPdf
または
Java PDF JAR(ジャバPDF JAR)

ダウンロード DLL (ディーエルエル)

DLLをダウンロード

プロジェクトに手動でインストールする

PDF 用 C# NuGet ライブラリ

でインストール NuGet

Install-Package IronPdf
または
Java PDF JAR(ジャバPDF JAR)

ダウンロード DLL (ディーエルエル)

DLLをダウンロード

プロジェクトに手動でインストールする

今日からプロジェクトでIronPDFを使い始めましょう。無料のトライアルをお試しください。

最初のステップ:
green arrow pointer

チェックアウト IronPDF オン Nuget 迅速なインストールと展開のために。8百万以上のダウンロード数により、PDFをC#で変革しています。

PDF 用 C# NuGet ライブラリ nuget.org/packages/IronPdf/
Install-Package IronPdf

インストールを検討してください IronPDF DLL 直接。ダウンロードして、プロジェクトまたはGACの形式で手動でインストールしてください。 IronPdf.zip

プロジェクトに手動でインストールする

DLLをダウンロード

改ページを追加

HTMLで改ページを作成する場合は、HTMLコードに以下を使用できます:

もちろん、英語のテキストを教えていただけますでしょうか?

もちろん、英語のテキストを教えていただけますでしょうか?

ページブレークを作成するデモンストレーション

この例では、HTMLに以下の表と画像があり、表の後に改ページを追加することで、それらを別々のページにしたいと思います。

テーブル

会社 製品
アイアンソフトウェア IronPDF
アイアンソフトウェア IronOCR

画像

: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")
VB   C#

上記のコードは以下のPDFを生成し、2ページに分かれています。最初のページにはテーブルがあり、2ページ目には画像が配置されています。

画像のページ分割を回避する

画像やテーブル内でページ分割を避けるには、ラッピングDIV要素に適用されるCSSの page-break-inside 属性を使用することができます。

<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

テーブル内のページ区切りを回避

上記のように、表内の改ページを避けるには、以下のCSSを使用します:

page-break-inside: avoid(ページ内の改行: 回避) これは、スタイルをブロックレベルのHTMLノードに適用するために、テーブル自体よりも囲むDIVに適用する方が適しています。

大規模なHTMLテーブルが複数のPDFページにわたる場合、各ページにテーブルのヘッダーとフッターを複製するには、次のコードを使用できます。テーブル内のグループ:

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

高度な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