将背景图像添加到使用 html-pdf 生成的每个 PDF 页面

问题描述

我使用 html-pdf (https://www.npmjs.com/package/html-pdf) 生成基于 HTML 文件的 PDF。 我现在正在尝试将背景图像添加到这些 PDF 中。一个特殊/额外的要求是第一页应该有另一个背景图片而不是页面 2...n。

我尝试使用标题功能，但从未显示背景图像。

我向模板添加了一个标题，该标题显示正确，并尝试使用以下 CSS 添加背景图像：

#pageHeader:after,#pageHeader-first:after {
    content: "";
    display: block;
    position: fixed;
    bottom: 0;
    right: 0;
    top: 0;
    left: 0;
    height: 297mm;
    width: 210mm;
    background-image: url('/background-default.jpg');
    background-repeat: no-repeat;
    background-size: contain;
  }

仅供参考，这是我在 HTML 文件中添加标题的方式：

 <div id="pageHeader">Test1</div>
 <div id="pageHeader-first">Test2</div>

知道我在这里做错了什么吗？ 或者有没有更好的方法来实现我正在寻找的东西？

解决方法

我找到了问题的解决方案：

由于 PhantomJS 的限制，显然我还必须将图像添加到正文并使用 display: none; 隐藏它们。 完成后，图像还将显示在 html-pdf 的页眉/页脚部分。

可在此处找到更多详细信息：https://github.com/marcbachmann/node-html-pdf/issues/12