レスポンシブ HTML から PDF へ

import {PdfDocument, CssMediaType, FitToPaperModes} from "@ironsoftware/ironpdf";

(async () => {
    const options = {
        // Choose Screen or Print CSS media
        cssMediaType: CssMediaType.Screen,
        
        // Set paper mode to automatic fit to physical paper
        fitToPaperMode: FitToPaperModes.FitToPage,
    };

    // Render an HTML file
const pdf = await PdfDocument.fromHtml("Responsive.html", {renderOptions: options});

await pdf.saveAs("pdf-from-html.pdf");
})();

レスポンシブ HTML から PDF へ

ビューポート設定に関しては、CSSメディアとペーパーモードがあります。

IronPDFのCSSメディアオプションでは、HTMLコンテンツをPDFドキュメントにレンダリングする際にスタイルをどのように適用するかを指定できます。このオプションの2つの値は、CSSメディアの「スクリーン」と「プリント」です：

スクリーン: CSSルールが画面上での表示を意図していることを示します。スタイルはデジタル画面用に最適化されており、通常、コンピューターモニター上で見栄えが良い色やレイアウトを含みます。
プリント: ブラウザに印刷されたドキュメント用のスタイルを適用するよう指示します。これは、HTMLコンテンツを紙などの物理媒体に印刷するときに、CSSルールが読みやすさと適切なフォーマットを保証するよう最適化されていることを意味します。

IronPDFのペーパーサイジングオプションにおけるペーパーモードオプションは、レンダリングされたコンテンツをPDFページにどのように合わせるかを決定します。このオプションにはいくつかの値があります：

ContinuousFeed: このモードは、コンテンツが紙ロールに印刷される連続用紙プリンターに適しています。通常、工業環境などの専門的な印刷で使用されます。
FitToHeight: このモードでは、アスペクト比を維持しながら、指定された用紙の高さにコンテンツを合わせて拡大縮小します。これにより、コンテンツ全体が溢れることなく表示されることが保証されます。
FitToWidth: このモードでは、アスペクト比を維持しながら、指定された用紙の幅にコンテンツを合わせて拡大縮小します。これにより、特定の幅の制約内にコンテンツが収まるようにしたい場合に便利です。
FitToPage: このモードでは、アスペクト比を維持しながら、ページ全体（高さと幅の両方）にコンテンツを合わせて拡大縮小します。これにより、コンテンツ全体が1ページに収まることが保証されます。

レスポンシブPDFレンダリングのためのビューポート例を探る