如何使用每个页面上的动态内容更新页脚？

Question

在我们的 PrinceXML pdf 中的每个页面中，我们需要根据 php 动态变量更改页脚中的内容。

有没有办法更新每页页脚中的内容？

（下面是css代码和div）

css:

@page{ 
    size: US-letter portrait;
    margin: 1in .5in;
    @top{
      content: flow(header);
    }
    @bottom{
      content: flow(footer);
    }
    @bottom-right{
      content: '';
    }
  }
  @page rotated{
    size: US-letter landscape;
  }

  .rotated-page{
    page:rotated;
  }
  /*pagebreaks*/
.page-break{
    page-break-before: always;
  }
.page-break-after{
    page-break-after: always;
  }

/* page_header*/
#header{
    width: 100%;
    flow: static(header,start);
}
.logo-line{
    width:90%;
    margin: 0 auto;
    text-align: center;
}
.page-title{
    font-size: 20px;
    font-family: arial;
    font-weight: bold;
    text-align: center;
    margin: 0;
    padding: 0;
}

/* page_footer*/
#footer{
  width: 100%;
  padding:0;
  border-top: 3px solid #5D1F22;
  flow: static(footer,start);
}

页脚 div：

<div id="footer">
    <div class='footer-left'>Revision for <?= $this->manual_nm; ?> in <?= $this->revision_cycle; ?> <br>Submission Document printed on <?= $this->generated_date; ?></div>
    <div class='footer-right'></div>
</div>

Answer 1

您可以从页面中提取文本以填充页眉和页脚。

例如，如果我希望最新的h2 标记出现在页脚中，我可以使用以下 CSS 从标题中提取它。

h2 {
    string-set: title content();
}

名称title 是您指定的名称 - 例如，您可以将其称为heading。

然后您可以在页脚中使用此字符串：

@page {
    @bottom-left {
        content: string(title);
    }
}

示例改编自Using CSS Paged Media to Add Dynamic Headers。