如何将页脚移动到@page 中使用的 margin-bottom space 的 space

Question

我有以下@page

@page {
    size: 210mm 297mm;
    background: white;
    display: block;
    margin-bottom: 15%; // eliminates the page size on the bottom
}

我需要使用 flying-saucer-pdf 版本 9.1.22 将页脚显示到这个遗漏的边距。

我尝试了以下代码，但它不起作用：

@media print {
        div.divFooter {
                margin-bottom: -15% !important; // I need to take advantage of the free space of @page margin bottom
                padding: 0;
                box-sizing: border-box;
                position: fixed;
                bottom: 0;
                height: 80px;
                z-index: 1; 
        }
}

Answer 1

感谢 this, this and this 页，我找到了解决方案。

@page {
   size: 210mm 297mm;
   background: white;
   margin-bottom: 2.3cm;
   @bottom-left {
      vertical-align: top;
      content: element(footer);
      padding-top: 1px;
      border-top:1px solid #777;
   }
   @bottom-center {
      border-top:1px solid #777;
   }
   @bottom-right {
      border-top:1px solid #777;
   }

}
footer {
   margin-top: 0.1cm;
   display: block;
   position: running(footer);
   font-size: 8pt;
   line-height:1.0;
}

我的 html 代码包含以下元素：

<footer>
   <p style="font-size: 10pt;"><b>Note(s)</b></p>
   <p>This is a printed copy.</p>
</footer>

评论：不要在 body 或 @page 中使用 position: 块，因为 running() 将不起作用。

如何将页脚移动到@page 中使用的 margin-bottom space 的 space

How to move footer to the space of margin-bottom space used in @page

html

css

margin

itext

flying-saucer