paged.js 分页内容：页脚仅出现在最后一页，顶部标题有效

Question

再会，

我使用 paged.js 在每个页面上添加了顶部标题，但这种方法不适用于页脚。我考虑过缺少分号。

https://jsfiddle.net/aldari/sy3pb7a2/6/

@page {
  @top-center {
    content: element(repeatable);
  }
  
  @bottom-center {
    content: element(footerblock);
  }
  
  border: 1px solid black;
}

.repeatable {
  display: block;
  position: running(repeatable);
}

.footerblock {
  display: block;
  position: running(footerblock);
}

.page1,
.page2,
.page3 {
  break-before: page;
}

<script src="https://unpkg.com/pagedjs/dist/paged.polyfill.js"></script>

<div class="wrapper">

  <div class="repeatable">
    <div class="">header</div>
  </div>

  <div class="page1">page 1 content</div>
  <div class="page2">page 2 content</div>
  <div class="page2">page 3 content</div>

  <div class="footerblock">
    <div class="">footer</div>
  </div>
</div>

Answer 1

我遇到相同的报告： 分页媒体中的运行页脚“元素（页脚）”仅出现在最后一页

答案：将页脚内容放在主要内容之前，就像在页眉中一样。重复块是从主流程中提取的，但直到最后一页才为页面定义，因此它应该出现在主要内容之前的开头。

<script src="https://unpkg.com/pagedjs/dist/paged.polyfill.js"></script>

<div class="wrapper">

  <div class="repeatable">
    <div class="">header</div>
  </div>

  <div class="footerblock">
    <div class="">footer</div>
  </div>

  <div class="page1">page 1 content</div>
  <div class="page2">page 2 content</div>
  <div class="page2">page 3 content</div>
</div>