如何使用CSS在Chrome中準確模擬A4紙進行列印？

調整CSS 以模擬A4 紙張並啟用準確列印

要在Web 中建立模擬A4 紙張並在Chrome 中準確列印，需要使用某些CSS調整是必要的。雖然提供的元素尺寸 21 厘米 x 29.7 厘米可能看起來正確，但在打印或生成打印預覽時，頁面會被剪裁。

解決問題

經進一步調查，根本原因在於列印媒體規則中將「初始」分配給頁寬。如果沒有為其父元素定義特定的長度值，則在 Chrome 中使用「initial」作為寬度會導致縮放。這會導致頁面太長且內邊距大於預期的 2 公分。

解決方案

要修正此問題，請將「initial」替換為實際紙張列印媒體規則中的寬度 (210mm) 和高度 (297mm)。將此應用於“html”、“body”或直接應用於“.page”元素。

範例

以下修訂後的CSS 程式碼合併了建議解決方案：

相容性相容性

相容性相容性相容性相容性相容性相容性相容性相容性相容性相容性相容性相容性相容性相容性相容性相容性相容性>此解決方案成功解決了Chrome中的列印問題（在各種作業系統平台上進行了測試），同時保留了其他瀏覽器中的功能。

以上是如何使用CSS在Chrome中準確模擬A4紙進行列印？的詳細內容。更多資訊請關注PHP中文網其他相關文章！