如何缩小页面内容以适应 window.print()

【问题标题】：How to scale down page content to fit window.print()如何缩小页面内容以适应 window.print()
【发布时间】：2022-02-08 02:31:04
【问题描述】：

window.print 函数有问题。我有一个应该适合 A4 横向页面的页面，但它不适合。看起来A4页面不够宽，所以将一些内容推到了下一页（我一排有5张卡片，其中一张推到了第二排）。有没有办法在不改变每个对象的宽度等的情况下缩小内容？

【问题讨论】：

【解决方案1】：

当然！

您可以像这样使用打印媒体查询：

@media print {
    print-area *{ /* can be whatever CSS selector you need */
        transform: scale(x)
    }
}

其中 x 是您要缩小的尺寸。

【讨论】：

问题在于缩小了元素，但它们与之前的位置相同，只是更小（元素之间的间隙更大）。我想我设法解决了这个问题，你所要做的就是@media print { body{ width:1400px; } }