ホームページ >ウェブフロントエンド >CSSチュートリアル >CSSを使用してChromeでA4印刷クリッピングを修正する方法?
問題:
HTML 要素のサイズを A4 寸法 (21cm) に設定するx 29.7cm) では、ブラウザでは正しく表示されているにもかかわらず、Chrome で印刷するとページがクリッピングされてしまいます。 window.
分析:
Chrome では、特に印刷メディア ルールでページ幅に「initial」を割り当てる際に問題があるようです。これにより、定義された A4 寸法よりわずかに大きいサイズにコンテンツが拡大縮小され、クリッピングが発生します。
解決策:
この問題を解決するには、'initial' の使用を避けてください。 ' 印刷メディア ルールのページ幅。代わりに、A4 のサイズを HTML、本文、または直接「.page」要素に明示的に割り当てます。
@page { size: A4; margin: 0; } @media print { html, body { width: 210mm; height: 297mm; } }
固定サイズを設定すると、コンテンツは A4 の境界内に留まり、クリッピングが防止されます。これにより、残りの CSS スタイルを維持しながら Chrome の問題が解決されます。
注: この変更により、Chrome によるページ幅の「初期」の処理に関する特定の問題が解決されます。ただし、印刷出力の一貫性と正確性を確保するために、さまざまなブラウザーで印刷機能をテストすることが重要です。
以上がCSSを使用してChromeでA4印刷クリッピングを修正する方法?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。