Question

我有一个简单的HTML文档，其中仅包含图像标记。我想在文档加载后打印图像。我的代码：

<body>    
    <img id="form1" src="form1.jpg" alt="form1" style="margin: 0 auto;display:block;" onLoad="javascript:window.print()" />
</body>

它有效但问题是它打印图像（网页）和另一张空白的纸张，顶部只有一个文本，它给出了图像和html标题的地址。如何防止打印多余的纸张？

P.S：我使用了像PrintElement.js，jqPrint.js等jquery插件，但是他们有同样的问题...

Answer 1

您可以使用CSS控制图像大小等进行打印 - 使用@media print

为图片添加max-width。

这样，您就可以控制图像在页面上的呈现方式。示例：

@media print { 
    body img {
       width: 90%; max-width: 1048px; 
    } 
}

Answer 2

稍微缩小图像并以边距为中心。

<img src="form1.jpg" width="90%" style="margin:auto;"/>

Answer 3

您可以通过js制作iframe标签并将图像放在其上然后仅打印iframe。

我希望它有用

<iframe id="iframeprint" style="display:none"></iframe>

也许你需要这个js代码

访问iframe内部

document.getElementById('iframeprint').contentWindow.document.body.innerHTML=document.getElementById('form1');

仅打印iframe

document.getElementById('iframeprint').contentWindow.print() ;