Question

如果我使用Chrome或Firefox打印图像，我会遇到一些问题。我还没有找到如何摆脱纵向或横向的白色边框。这stackoverflow-solution似乎不适合我。

目前我使用此代码：

    echo "<body onload=\"window.print()\" onfocus=\"window.close()\">";

    echo "<style type=\"text/css\" media=\"print\">";
    echo "@page { size: auto; }";
    echo "</style>";

    echo "<img src=\"". $dirname . '/' . $photo ."\">";

我得到的结果与将它从Windows文件夹拖放到互联网导航器中的结果相同，例如：

Chrome设为： - 景观 - 颜色 - A4 - 没有Marges

bug

Answer 1

尝试应用容器css：

@page {
  size: A4;
  margin: 0;
}
@media print {
  html, body {
    width: 210mm;
    height: 297mm;
  }
}

然后使用 img 标签而不是使用背景图片+尺寸封面

body {
    background-image:  url(images/background.svg);
    background-size:   cover;                      /* <------ */
    background-repeat: no-repeat;
    background-position: center center;            /* optionally, center the image */
}

源：

Answer 2

您的图片文件可能具有与纸张尺寸不同的尺寸，因此除非您想要拉伸图像以填充页面，或使用background-size: cover;之类的内容，否则将始终存在边距

如何打印完全填充A4或其他格式的图像？

2 个答案: