IRONSOFTWAREHOME
HTML 渲染設定
import {PdfDocument, WaitForType, CssMediaType, FitToPaperModes, PdfPaperOrientation, PaperSizeUnit} from "@ironsoftware/ironpdf";

(async () => {
    // Many rendering options to use to customize!
    const options = {
        paperSize: {
            unit: PaperSizeUnit.Inch,
            width: 12.5,
            height: 20,
        },
        printHtmlBackgrounds: true,
        paperOrientation: PdfPaperOrientation.Landscape,
        title: "My PDF Document Name",
        waitFor: {
            type: WaitForType.RenderDelay,
            maxWaitTime: 50, // in milliseconds
        },
        cssMediaType: CssMediaType.Screen,
        fitToPaperMode: FitToPaperModes.FitToPage,
        createPdfFormsFromHtml: true,

        // Supports margin customization
        margin: {
            top: 40, // millimeters
            left: 20, // millimeters
            right: 20, // millimeters
            bottom: 40, // millimeters
        },

        // Can set FirstPageNumber if you have a cover page
        firstPageNumber: 1, // use 2 if a cover page will be appended
    };

    // Render HTML page to PDF
    const pdf = await PdfDocument.fromUrl("https://angular.io/", { renderOptions: options });
    
    // Save the PDF
    await pdf.saveAs("my-content.pdf");
})();
npm i @ironsoftware/ironpdf
HTML 渲染設定

HTML 渲染設定

在從HTML字串、文件或網頁URL進行渲染時,您可以配置多種渲染選項。 上述設定包括自定義紙張尺寸及可配置的測量單位,啟用HTML背景、頁面方向、文件標題、延遲渲染過程、指定CSS媒體型別、選擇紙張模式、建立可編輯的表單欄位、自定義邊距以及新增頁碼。

CSS媒體型別"screen"和"print"是用於指定樣式應如何應用於HTML文件的指令,根據顯示或輸出的媒介來決定。 當選擇"screen"作為媒體型別時,表示CSS規則旨在用於螢幕觀看,優化例如顏色和佈局等因素以適合數位螢幕。 相反地,當選擇"print"時,它指示瀏覽器應用針對印刷文件的樣式,確保在將HTML內容列印到實體媒介上時的可讀性和適當的格式設置。 有時候,需要將CSS媒體型別設置為"screen"來顯示某些背景圖片。

渲染過程中的延遲主要是為JavaScript或字型載入提供足夠的時間。

解釋:

  • HTML結構:程式碼按照標準HTML5格式結構化,包含<body>部分。
  • 中繼資料:<meta>標籤定義了字元集和響應式設計的視口。

樣式表:

  • 預設body樣式:設置適用於所有媒體的字型系列和邊距。
  • Screen媒體查詢:適用於數字螢幕的淺灰色背景和較深的文字。
  • Print媒體查詢:適用於列印的白色背景和黑色文字。

範例使用: 給定的HTML和CSS結構幫助演示不同樣式可以根據內容是在螢幕上查看還是列印時如何應用。

在GitHub上發現更多PDF生成設定範例。
在 GitHub 上查看

準備好開始了嗎?

版本:2026.6剛剛發布

Key in blue circle

立即免費取得 30 天試用金鑰。

Your trial license will be sent to your email address

無任何限制。100% 解鎖。無需信用卡。

OR
bullet_checked無需信用卡或建立帳號無任何限制。100% 解鎖。無需信用卡。
  • Logo Aetna
  • Logo NASA
  • Logo GE
  • Logo Porsche
  • Logo USDA
  • Logo Qatar
Join Millions of Engineers who’ve tried Iron Suite
預訂您的免費線上演示
Booking Badge

獲得來自全球數百萬工程師的信賴

Iron Software的客戶徽標
獲取您的無義務諮詢
填寫以下表格或發送電子郵件至sales@ironsoftware.com
您的資料將始終保密。
獲得來自全球數百萬工程師的信賴
Iron Software的客戶徽標
立即獲取您的30天試用金鑰。
無需信用卡或帳戶建立
Node.js模組下載PDF
使用npm安裝

版本: 2026.6

  1. 下載並安裝Node.js 12+。
  2. 在終端機中執行上述命令。

授權從$999起