打印带有图像的 html(每个图像都在单独的页面上) [英] Print html with images (every image on separate page)

查看:59
本文介绍了打印带有图像的 html(每个图像都在单独的页面上)的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个带有图片的 HTML:

I have an HTML with images:

<img id="1" .../>
<img id="2" .../>
<img id="3" .../>
<img id="4" .../>

在打印时,我希望每个图像都在单独的页面上(根据打印尺寸).

While printing, I want every image to be on a separate page (according to the print size).

现在我将图像从中间切掉了.

Now I get the images cut off in the middle.

有什么办法可以解决吗?

Is there any way to fix it?

推荐答案

您可以尝试以下..

<html>
    <head>
        <style type="text/css">
            @media print {
                p.pageBreak {page-break-after: always;}
            }
        </style>
    </head>
    <body>

    <p class="pageBreak">
        <img id="1" src="http://placehold.it/250x250">
    </p>
    <p class="pageBreak">
        <img id="2" src="http://placehold.it/250x250">
    </p>
    <p class="pageBreak">
        <img id="3" src="http://placehold.it/250x250">
    </p>
    <p class="">
        <img id="4" src="http://placehold.it/250x250">
    </p>
    </body>
</html>

这篇关于打印带有图像的 html(每个图像都在单独的页面上)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆