使用CSS在PDF的每个页面中添加页脚文本

使用CSS在PDF的每个页面中添加页脚文本,css,pdf,each,footer,Css,Pdf,Each,Footer,我需要在PDF的每一页中应用页眉和页脚文本,因为我使用的是CSS的下一行。通过这一点,我可以在每一页中应用页眉文本,但不能应用页脚文本。我只在PDF的最后一页得到页脚文本 @@page { @@top { content: element(header); } @@bottom { content: element(footer); }

我需要在PDF的每一页中应用页眉和页脚文本,因为我使用的是CSS的下一行。通过这一点,我可以在每一页中应用页眉文本,但不能应用页脚文本。我只在PDF的最后一页得到页脚文本

   @@page {
         @@top {
                content: element(header);
            }

            @@bottom {
                content: element(footer);
            }
        }

        header {
            padding: 10px;
            position: running(header);
            }

     footer {
            padding: 5px;
            position: running(footer);
        } 

我假设您正在使用类似的东西从HTML生成PDF。如果没有,我道歉,并在其他地方找到类似的代码,在所有页面上生成页眉和页脚。这似乎可以正常地从浏览器打印到PDF

CSS

<style type="text/css">
<!-- 
@page {
 margin: 2cm;
}

.header, .footer{
 position: absolute;
}

.footer{
 bottom:0;
 height: 40px;
}

.header{
 top: 0;
 height: 40px;
} 

.content{
 margin-top: 45px;
 margin-bottom: 45px;
}
-->
</style>

HTML代码

<div class="header">
  Header html goes here
</div>
<div class="content">
  page content goes here
</div>
<div class="footer">
  footer code goes here
</div>

标题html在这里
页面内容在这里
页脚代码在这里

添加内容类以及元素页眉和页脚中指定的高度有助于阻止内容在每页的页眉和页脚上全部写入。

我也有同样的问题,问题是您必须将“页脚”和“页眉”div都放在页面顶部,否则页脚将无法工作。不知道为什么…

#页脚{
位置:固定;
宽度:100%;
底部:0;
左:0;
右:0;
}
#页脚p{
边框顶部:2个实心#555555;
边缘顶部:10px;
}

页脚文本