如何在 C# 中使用 CSS 和 HTML 来制作响应式 PDF.

为什么选择正确的 CSS 媒体类型很重要？

IronPDF 可使用 C# 从 HTML 生成 PDF，默认情况下可将屏幕样式表渲染为 PDF。 这很方便，因为打印样式表通常比屏幕样式表记录、使用或开发得少。 然而，了解这些媒体类型之间的区别对于制作专业品质的 PDF 至关重要。

在 IronPDF 中使用 CSS(屏幕和打印) 时，屏幕和打印媒体类型的选择会对您的最终 PDF 输出产生重大影响。 屏幕媒体类型要保留互动元素和丰富的视觉设计，而印刷媒体类型则要优化内容的可读性和纸质阅读。

CSS3允许某些CSS样式仅在打印文档中呈现，而其他样式仅用于网页浏览器。 IronPdf 可与二者配合使用，让您完全控制HTML 内容如何呈现为 PDF 。 这种灵活性确保了无论您是创建数字报告、可打印发票还是混合文档，您的 PDF 都能满足其预期使用情况的特定要求。

何时应使用打印与屏幕 CSS 媒体类型？

创建并应用打印样式表到您的HTML：学习如何创建并应用完美的打印样式表。

每种 CSS 媒体类型都针对不同的使用情况。 尝试每一种，看看哪种适合您的要求。 请考虑以下指导原则：

在以下情况下使用打印 CSS 媒体类型：

• 创建用于实际印刷的文件
• 生成发票、报告或正式文件
• 您需要在各页中重复使用表头
• 节约墨水是首要任务
• 使用 自定义纸张尺寸的要求工作

在以下情况下使用屏幕 CSS 媒体类型：

• 创建具有丰富视觉元素的交互式 PDF
• 在 PDF 中保留网页设计美感
• 包括背景图片和颜色
• PDF 将主要在屏幕上阅读
• 使用响应式 HTML 转换为 PDF

屏幕模式和打印模式的视觉差异是什么？

上面的例子展示了相同的 HTML 内容如何根据 CSS 媒体类型的选择而呈现出不同的效果。 请注意，印刷版删除了装饰性图像和图标，以创建更简洁、更便于打印的文档，而屏幕版则保留了所有视觉元素，以方便数字浏览。

为什么表头在屏幕模式下只显示一次？

当处理跨越多个页面的 HTML 表格时，将PdfCssMediaType.Print 。 这样可以确保表头在每个扩展页面的顶部重复出现。 相反， PdfCssMediaType.Screen指示 Chrome 只打印一次标头。 在创建带有冗长数据表的 PDF 报告时，这种行为尤为重要。

印刷媒体类型会激活浏览器用于分页的特定 CSS 规则，包括启用标题重复的 thead {display: table-header-group;} 属性。 当读者翻阅多页文档时，这一功能对于保持上下文衔接至关重要。

重复标题需要哪些 HTML 结构？

为确保 Chrome 检测到表格标题，请将其包含在 <thead> 标签中。 Let's render the 'tableHeader.html example of repeating table headers' HTML file to PDF to see the effect.

以下是推荐的 HTML 结构：

<table>
    <thead>
        <tr>
            <th>Column 1</th>
            <th>Column 2</th>
            <th>Column 3</th>
        </tr>
    </thead>
    <tbody>

    </tbody>
</table>

<table>
    <thead>
        <tr>
            <th>Column 1</th>
            <th>Column 2</th>
            <th>Column 3</th>
        </tr>
    </thead>
    <tbody>

    </tbody>
</table>

如何在 C# 中实现表头重复？

:path=/static-assets/pdf/content-code-examples/how-to/html-to-pdf-responsive-css-table-header.cs

using IronPdf;
using IronPdf.Rendering;

ChromePdfRenderer renderer = new ChromePdfRenderer();

// Change the paper size to small
renderer.RenderingOptions.SetCustomPaperSizeinPixelsOrPoints(600, 400);

// Choose screen or print CSS media
renderer.RenderingOptions.CssMediaType = PdfCssMediaType.Print;

// Render HTML to PDF
PdfDocument pdf = renderer.RenderHtmlFileAsPdf("tableHeader.html");

pdf.SaveAs("tableHeader.pdf");

如需更多高级表格格式选项，请探索 Custom Margins 以控制表格周围的间距，或实施 Page Breaks 以确保表格在需要时从新页面开始。

最终的 PDF 输出是什么样的？