所有页面上的CSS @page background-images？

Question

我希望每个打印页面上都有相同的背景图像。每当页面由于溢出而需要时，它的背景图像应该与上一页相同。

我一直在尝试这样做

@page {
    size: US-Letter portrait;
    background-image: url("something.jpg");
    padding: 3in .5in .75in .5in;
}

但是，这不适用于任何浏览器。这根本不可能吗？还是还有一些我还没有发现的窍门？

Answer 1

对于打印，您可能希望使用@media print媒体查询而不是@page或将它们组合。同样，size属性似乎没有有效的值。

@media print {
  @page {
    size: letter portrait;
    background-image: url("something.jpg");
    padding: 3in .5in .75in .5in;
  }
}

Answer 2

这种完成工作的方式：

@media print {
    body {
        background: url("something.jpg");
    }
}

还要确保有关打印机let you to print a background的浏览器设置。 （在Firefox中，它是对话框中的选项标签，可让您选择打印机。）