使用 C# 在 HTML PDF 中添加或避免分页符

Q: 哪些 HTML 元素最适合使用分页符样式？

分页符对于块级元素（如" `"、" `"和" `")最为有效。IronPDF 建议在将 HTML 转换为 PDF 时，使用具有分页符样式的专用 ` ` 元素包装内容，以获得最可靠的结果。

已更新:2025年12月14日

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 文档的可读性和组织性。 <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

使用 NuGet 包管理器安装 https://www.nuget.org/packages/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

最小工作流程（5 个步骤）

下载 C# 库以在 PDF 中使用分页符。
将分页符应用于 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

在将 HTML 渲染为 PDF 时，page-break-after CSS 属性是控制分页的最可靠方法。该属性会告诉 PDF 渲染器在包含该样式的元素后立即插入分页符。在使用自定义页边距或特定页面布局时，分页符可确保内容准确出现在预定位置。

为什么 page-break-after 比其他方法更有效？

在此示例中，我的 HTML 代码中包含以下 table 和 img，我希望将它们分在两个不同的页面上，方法是在 table 之后添加分页符。与 page-break-after 属性相比，page-break-before 或其他手动空格等替代方案在不同渲染引擎中呈现的效果更为一致。在创建具有复杂布局的新 PDF 时，这种方法可确保可预测的分页。

分页符应使用哪些元素？

分页功能可与 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");

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：第一页为 table，第二页为 img：

如何防止图像出现断页？

为避免在图片或 table 内部出现换行，请在包裹的 div 元素上应用 CSS avoid 属性。当使用 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 包裹标签可避免此类问题，它能确保整个图片及其容器作为一个整体移至下一页。

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");

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

如何避免表格中的分页符？

如上所示，可通过 CSS avoid 避免表格内的分页。将此样式应用于包裹的 div 标签，而非表格本身，可确保样式正确应用于块级 HTML 节点。在创建全面的 HTML 转 PDF 教程时，正确的表格格式对可读性至关重要。

何时应在表头使用 thead？

若要在跨越多个 PDF/A 页面的大型 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