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

Question

我正在使用 html-pdf (https://www.npmjs.com/package/html-pdf) 基于 HTML 文件生成 PDF。我现在正尝试向这些 PDF 添加背景图像。一个 special/additional 要求是第一页应该有不同于第 2...n 页的背景图像。

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

我在模板中添加了 header，显示正确，并尝试使用以下 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 文件中添加 header 的方式：

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

知道我在这里做错了什么吗？或者有更好的方法来实现我想要的吗？

Answer 1

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

由于 PhantomJS 的限制，显然我还必须将图像添加到主体中并使用显示隐藏它们：none; 完成后，图像也将显示在 html-pdf 的 header/footer 部分。

可以在这里找到更详细的信息：https://github.com/marcbachmann/node-html-pdf/issues/12

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

Add background image to each PDF page generated using html-pdf

css

node.js

html-pdf