1. IronPDF
  2. 操作指南
  3. 調整至紙張大小與Zoom
如何在 C# 中使用虛擬視口與 Zoom 功能

如何在 IronPDF 中使用 C# 虛擬視口與 Zoom 功能

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

透過 RenderingOptions 屬性設定 ViewPortWidth 和 Zoom 值，即可在 IronPDF 中控制檢視窗格與縮放比例；或在 HTML 轉 PDF 過程中，利用預設的 PaperFit 模式來自動處理版面配置。

在 HTML 轉 PDF 的渲染過程中，視口決定了網頁版面配置在生成的 PDF 文件中將如何呈現。 它代表瀏覽器用於渲染網頁的虛擬螢幕尺寸。 在使用 IronPDF 的 Chrome 渲染引擎時，理解視口設定對於獲得精確的結果至關重要。

Zoom 控制 PDF 文件中網頁內容的縮放比例。 微調縮放比例可調整 PDF 中的內容大小，確保版面配置與格式正確無誤。 此功能在處理必須適應不同頁面尺寸的響應式 CSS 佈局時特別有用。

快速入門：使用 IronPDF 控制 Zoom 與檢視窗格

使用 IronPDF 管理 HTML 轉 PDF 過程中的縮放與視口設定。 本指南提供了一個簡單的程式碼片段，供您開始調整 HTML 內容的縮放比例。 只需少量程式碼，即可確保 PDF 檔案正確顯示，同時維持響應式設計元素與預期的版面配置。

UseChromeDefaultRendering UseResponsiveCssRendering ViewPortWidth UseScaledRendering width margin

  1. using NuGet 套件管理員安裝 https://www.nuget.org/packages/IronPdf

    PM > Install-Package IronPdf

  2. 請複製並執行此程式碼片段。

    new IronPdf.ChromePdfRenderer { RenderingOptions = { ViewPortWidth = 1280, Zoom = 1.8 } }
    .RenderUrlAsPdf("https://example.com")
    .SaveAs("zoomedViewport.pdf");

  3. 部署至您的生產環境進行測試

    立即透過免費試用，在您的專案中開始使用 IronPDF

    arrow pointer

簡化工作流程（5 個步驟）

  1. 下載 IronPDF C# 函式庫，用於 PDF 渲染與視窗區域控制
  2. 使用不同預設模式的 RenderHtmlToPdf
  3. 使用 ChromeDefault 和 ResponsiveCSS 模式以在 PDF 中實現自動版面配置
  4. 使用縮放功能來放大內容
  5. 針對特定使用情境，請使用 FitToPage 和 ContinuousFeed 設定"適應頁面"與"連續輸出"


IronPDF 中的紙張配置模式有哪些？

請存取 PaperFit 中的 RenderingOptions 欄位，以使用針對特定渲染類型和模式的預設方法。 這些模式提供了將 HTML 內容渲染至 PDF 頁面的不同方法，類似於建立自訂紙張尺寸時所使用的技術。 讓我們透過渲染維基百科主頁進行比較，來檢視每種 PaperFit 模式。

PaperFit 模式可處理各種內容版面配置，從標準網頁到收據或報告等特殊文件皆能應對。 每種模式皆針對特定使用情境進行優化，確保 PDF 文件無論原始內容格式為何，皆能維持預期的設計與可讀性。

如何使用 Chrome 預設渲染模式？

此模式會將 PDF 頁面以 Google Chrome 列印預覽中的顯示方式呈現。 它會設定渲染選項，使從 Chrome 列印出的網頁外觀與原始網頁一致。 響應式 CSS 視口會根據其寬度來解讀指定的紙張尺寸。 請使用 ChromeDefaultRendering 方法進行設定。

Chrome 的預設渲染效果與瀏覽器的列印預期保持一致。 此工具適用於標準網頁及文件，能有效保留內容的自然流暢性，呈現效果與一般瀏覽器PRINT操作無異。 針對涉及 JavaScript 渲染的高階情境，此模式可確保動態內容正確執行與顯示。

:path=/static-assets/pdf/content-code-examples/how-to/viewport-zoom-default-chrome.cs
using IronPdf;

ChromePdfRenderer renderer = new ChromePdfRenderer();

// Chrome default rendering
renderer.RenderingOptions.PaperFit.UseChromeDefaultRendering();

// Render web URL to PDF
PdfDocument pdf = renderer.RenderUrlAsPdf("https://en.wikipedia.org/wiki/Main_Page");

pdf.SaveAs("chromeDefault.pdf");
Imports IronPdf

Private renderer As New ChromePdfRenderer()

' Chrome default rendering
renderer.RenderingOptions.PaperFit.UseChromeDefaultRendering()

' Render web URL to PDF
Dim pdf As PdfDocument = renderer.RenderUrlAsPdf("https://en.wikipedia.org/wiki/Main_Page")

pdf.SaveAs("chromeDefault.pdf")
$vbLabelText   $csharpLabel

如何使用響應式 CSS 渲染？

在響應式 CSS 模式下，請透過傳遞數值至 SetWidth 方法來指定視口寬度。 預設的 Width 為 1280 像素。 視口單位以像素為基礎，代表適用於響應式 CSS 設計的虛擬瀏覽器視口。 此模式支援現代框架，並相容於 Bootstrap 及 Flex CSS 佈局。

響應式 CSS 根據 ViewPortWidth 參數定義 HTML 渲染，並將內容縮放以適應指定的紙張寬度。 此方法適用於採用響應式設計原則的現代網頁應用程式，確保 PDF 無論原始視口大小為何，皆能維持預期的版面配置。當處理自訂邊距時，此模式可精確控制內容如何適應不同的頁面尺寸。

:path=/static-assets/pdf/content-code-examples/how-to/viewport-zoom-responsive-css.cs
using IronPdf;

ChromePdfRenderer renderer = new ChromePdfRenderer();

// Responsive CSS rendering
renderer.RenderingOptions.PaperFit.UseResponsiveCssRendering(1280);

// Render web URL to PDF
PdfDocument pdf = renderer.RenderUrlAsPdf("https://en.wikipedia.org/wiki/Main_Page");

pdf.SaveAs("responsiveCss.pdf");
Imports IronPdf

Private renderer As New ChromePdfRenderer()

' Responsive CSS rendering
renderer.RenderingOptions.PaperFit.UseResponsiveCssRendering(1280)

' Render web URL to PDF
Dim pdf As PdfDocument = renderer.RenderUrlAsPdf("https://en.wikipedia.org/wiki/Main_Page")

pdf.SaveAs("responsiveCss.pdf")
$vbLabelText   $csharpLabel

如何使用比例渲染？

SetScaledRendering 方法模擬 Chrome PRINT 預覽功能，針對指定的紙張尺寸提供可調整的 Zoom 比例。 此方法會根據輸入的Zoom百分比來調整內容大小。

比例渲染功能可精確控制 PDF 中的內容外觀。 與固定視口的方法不同，此方法允許動態調整內容大小，因此非常適合需要因應不同比例尺維持可讀性的文件，或在為各種顯示情境準備 PDF 時使用。 此技術可與頁面方向及旋轉設定相輔相成，以呈現最佳的文件效果。

:path=/static-assets/pdf/content-code-examples/how-to/viewport-zoom-scaled.cs
using IronPdf;

ChromePdfRenderer renderer = new ChromePdfRenderer();

// Scaled rendering
renderer.RenderingOptions.PaperFit.UseScaledRendering(180);

// Render web URL to PDF
PdfDocument pdf = renderer.RenderUrlAsPdf("https://en.wikipedia.org/wiki/Main_Page");

pdf.SaveAs("scaled.pdf");
Imports IronPdf

Private renderer As New ChromePdfRenderer()

' Scaled rendering
renderer.RenderingOptions.PaperFit.UseScaledRendering(180)

' Render web URL to PDF
Dim pdf As PdfDocument = renderer.RenderUrlAsPdf("https://en.wikipedia.org/wiki/Main_Page")

pdf.SaveAs("scaled.pdf")
$vbLabelText   $csharpLabel

如何使用"適應頁面"渲染功能？

"適應頁面"渲染功能會將內容縮放以適應指定的紙張尺寸。它會測量渲染後 HTML 內容的最小寬度，並在可能的情況下將其縮放以適應一張紙的寬度。 可配置的最小像素寬度可確保正確顯示，並能響應 CSS3 佈局規則。

此模式適用於可能橫向跨越多頁的內容。 此功能特別適用於需在單一頁面寬度內呈現的寬幅表格、圖表或儀表板。 自動縮放功能可確保所有內容皆清晰可見，無需橫向捲動，因此非常適合用於生成重視可讀性的 PDF 報告。

如何使用連續資料流渲染？

連續頁排版會生成單頁 PDF，將所有內容整合至單一頁面，適用於消費者帳單或收據等文件。預設的 PDF 頁面寬度為 80.0 公釐，邊距為 5 公釐。 Let's render the 'receipt.html' file to PDF.

請使用 SetPageWidth 和 SetMargins 參數自訂頁面寬度與邊距，以確保靈活性。 此模式會產生簡潔的單頁文件。 它可生成收據、發票或任何需要連續輸出且不分頁的文件。 結合 HTML 轉 PDF 的分頁控制功能，您可以根據特定需求建立精緻的文件版面配置。

:path=/static-assets/pdf/content-code-examples/how-to/viewport-zoom-continuous-feed.cs
using IronPdf;

ChromePdfRenderer renderer = new ChromePdfRenderer();

int width = 90;
int margin = 0;

// Continuous feed rendering
renderer.RenderingOptions.PaperFit.UseContinuousFeedRendering(width, margin);

// Render web URL to PDF
PdfDocument pdf = renderer.RenderHtmlFileAsPdf("receipt.html");

pdf.SaveAs("continuousFeed.pdf");
Imports IronPdf

Private renderer As New ChromePdfRenderer()

Private width As Integer = 90
Private margin As Integer = 0

' Continuous feed rendering
renderer.RenderingOptions.PaperFit.UseContinuousFeedRendering(width, margin)

' Render web URL to PDF
Dim pdf As PdfDocument = renderer.RenderHtmlFileAsPdf("receipt.html")

pdf.SaveAs("continuousFeed.pdf")
$vbLabelText   $csharpLabel

準備好探索更多可能性了嗎？ 請點此查看我們的教學頁面：PDF 轉換

常見問題

在 HTML 轉 PDF 的過程中，什麼是視口 (viewport)？

在 IronPDF 中，視口（viewport）代表 Chrome 渲染引擎在將網頁轉換為 PDF 之前，用於渲染網頁的虛擬螢幕尺寸。它決定了網頁版面配置在生成的 PDF 文件中如何被擷取，這對於實現精確的渲染結果至關重要。

如何用一行程式碼控制Zoom比例和視口寬度？

您只需一行程式碼即可同時控制 IronPDF 的視口寬度和縮放比例：new IronPdf.ChromePdfRenderer { RenderingOptions = { ViewPortWidth = 1280, Zoom = 1.8 } }.RenderUrlAsPdf('https://example.com').SaveAs('zoomedViewport.pdf'). 此設定將視口寬度設為 1280 像素，並套用 1.8 倍的 Zoom 係數。

什麼是 PaperFit 模式？

IronPDF 中的 PaperFit 模式是透過 RenderingOptions.PaperFit 欄位存取的預設方法，提供將 HTML 內容渲染至 PDF 頁面的不同方式。每種模式皆針對特定使用情境（如標準網頁、收據或報告）進行最佳化，確保 PDF 能維持預期的設計與可讀性。

為何 Zoom 控制對響應式 CSS 佈局如此重要？

IronPDF 中的 Zoom 控制功能在處理必須適應不同頁面尺寸的響應式 CSS 佈局時特別有用。微調 Zoom 等級可調整 PDF 中的內容大小，在維持響應式設計元素的同時，確保佈局與格式正確無誤。

視口與Zoom功能使用哪種渲染引擎？

IronPDF 中的視口與縮放功能採用 Chrome 渲染引擎。這確保網頁能準確且一致地呈現，與轉換為 PDF 之前在 Google Chrome 中的顯示效果完全一致。

什麼是 Chrome 預設渲染模式？

Chrome 預設渲染是 IronPDF 中的 PaperFit 模式，可將 PDF 頁面以 Google Chrome 列印預覽中的樣式進行排版。此模式會配置渲染選項，使其與從 Chrome 列印時的網頁外觀相符，並根據指定的紙張尺寸來解讀響應式 CSS 視口。

Curtis Chau
Curtis Chau
  立即與工程團隊聯繫
技術撰稿人

Curtis Chau 擁有卡爾頓大學（Carleton University）的電腦科學學士學位，專精於前端開發，並精通 Node.js、TypeScript、JavaScript 及 React。他熱衷於打造直觀且美觀的用戶介面，喜歡運用現代框架，並創建結構完善、視覺上吸引人的手冊。

除了開發工作之外，Curtis 對物聯網（IoT）抱有濃厚興趣，致力於探索整合硬體與軟體的創新方法。閒暇時，他喜歡玩遊戲和開發 Discord 機器人，將對科技的熱愛與創意相結合。

準備開始了嗎？
Nuget 下載 18,926,724 | 版本： 2026.5 just released
Still Scrolling Icon

還在往下捲動嗎？

想要快速確認成果嗎？ PM > Install-Package IronPdf
執行範例 觀看您的 HTML 轉為 PDF。