打印带有图像的html(每个图像都在单独的页面上)

Print html with images (every image on separate page)

本文关键字:图像 单独 html 打印      更新时间:2023-09-26

我有一个带图像的HTML:

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

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

现在我把图片从在中间剪下来。

有什么办法解决它吗?

您可以尝试以下操作。。

<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>