如何在html / javascript中设置打印预览的比例？

Question

当我打印网页时，如果比例设置为100，则整个页面无法在预览中显示。如果我将比例更改为70，我可以看到整个页面。我想知道我是否可以在HTML / Javascript中设置scale参数。

我尝试了transform: scale(0.7)，但它没有改变<div>大小。

Answer 1

您可以使用 CSS 通过添加打印媒体规则并按如下方式指定缩放因子来实现此目的：

    @media print {
    body {
        margin-top: 5px;
        margin-left: 10px;
        transform: scale(0.43);
        transform-origin: 0 0;
    }
}

以防万一您想让比例因子动态化，那么您可能需要使用如下动态变量并从 js 或 html 链接传递它，如下所示，其中“比例因子是变量”：

@media print {
    body {
        margin-top: 5px;
        margin-left: 10px;
        transform: scale(var(--scale-factor));
        transform-origin: 0 0;
    }
  }

Answer 2

Chrome PDF查看器或打印预览没有API。你几乎坚持得到的东西。

您有时可以通过直接更改PDF代码本身来实现一些技巧。我现在正在开发一个项目，我使用pdfkit自己构建pdf。我能够设置Chrome荣誉的一些标志，因此我获得自动打印（因为它在打开文档时自动打开打印预览）并禁用自动调整（因此它不会尝试调整大小到不同的纸张大小）。但那些必须嵌入到pdf中，而不是后来的样式。

如果您决定采用这条路线，我在问题论坛中发布recipes，了解我如何获得pdfkit来设置这些标志。

编辑： 对不起，我刚刚重新阅读了您的问题，并意识到您没有提及PDF。我自己跳了，因为带有标志的PDF基本上是你可以访问Print Preview控件的唯一方法，我相信这是PDF Viewer的扩展。因此，如果可以更改比例，则可以将页面转换为PDF并设置一些标记（我会搜索类似＆＃34;默认视图比例＆＃34;），希望Chrome不会这样做。 t在预览中忽略。