css - CSS - 打印：在所有页面中重复背景

Question

我有以下问题：

当我从我的网站打印某个页面，并且该页面的内容没有填满所有纸张时，背景图像会在那里剪切。但我需要的是在所有纸张中重复背景图像，无论内容占用了多少纸张。

很抱歉，我知道这个问题有点奇怪，所以我在解释它时遇到了很多麻烦。

非常感谢任何可以帮助我的人。

Answer 1

用这个..：

    body
{
    background-color:#454545;
background-image:url("background.jpg");
background-repeat:no-repeat;
background-attachment: fixed;
    background-size: contain;
    zoom: 100%;
}

将此粘贴到您的 css 中，您正在寻找的是“附件固定”...背景图像永远不会随着页面的其余部分滚动，您也可以将“固定”应用于其他元素以使其无滚动。

Answer 2

如果背景附加到 BODY 元素并且background-repeat: norepeat在您的 CSS 中设置为，请尝试

@page {
  margin: 1cm; /* or any other small value, maybe even 0 */
}

@media print {
  body {
    background-repeat: repeat;
  }
}

Answer 3

假设您的图像在 body 标签中，您唯一的机会是设置

html, body {
    width: 100%;
    height: 100%;
    background: url(../bg.png) repeat 0 0;
}

但是由于浏览器会在每个边框上设置边距，因此您将永远无法让背景在整个纸张上伸展。这可以由用户在打印对话框中设置为 0，但不能由 css / you 控制。