Question

我已经编写了以下CSS来在PDF的每一页上显示页眉和页脚

我想从PDF的第一页中删除标题
此外，我想增加页脚的高度，因此我的整个页脚文本将适合它。

<style>
    @page {
        @top-center {
        content: element(header,first-except);}
        @bottom-left {content: element(footer);}
    }
    div.header {
    padding: 10px;
    position: running(header);
    }
    div.footer {
        display: block;
        padding: 0px;
        position: running(footer);
        font-size:10px;
        size: 15.5in 10.2in;
    }
    .pagenumber:before { content: counter(page); }
    .pagecount:before { content: counter(pages);  }
</style>
.............
.............
<div align="left" class="header">
    <h3 id="heading"> Pension Scheme Account Opening Request (continued)</h3>
</div>

<div class="footer">    
    <div align="right">Page <span class="pagenumber"/> of <span class="pagecount"/></div>
    <div> MY FOOTER TEXT   </div>
</div>

Answer 1

要删除首页上的标题，请按照此页https://www.sundoginteractive.com/blog/different-headers-and-footers-by-page-in-pdf-salesforce上的说明进行操作。

基本上你创建一个空标题，如：<div class="header"><div></div></div>，另一个div与 page-break-before：always 类：<div style="page-break-before:always"></div>以强制分页告诉浏览器查找具有此页面所需CSS类的新DIV，最后是内容为<div class="header"><div>My header content</div></div>的“真实”标题div

要增加页脚，您可以为页面元素添加边距，例如：

@page {
        @top-center {
        content: element(header,first-except);}
        @bottom-left {content: element(footer);}
        margin-top: 200px;
}

Answer 2

1。要从首页删除页眉，请使用 @page {}

上方的以下代码

@page:first {
  @top-left {
  content: normal;
  }

2。要增加页脚大小，如果要向上抬起页脚，请使用

底部距：10mm；

示例代码：

@page {
     margin-bottom: 35mm;  
      @bottom-center { 
        content: element(footer);
             }    }

从HTML生成的PDF的第一页中删除标题 - CSS

2 个答案: