如何通过CSS为pdfkit生成的PDF设置跨页统一页眉页脚边距

目前使用Python pdfkit基于HTML模板生成PDF文件，整体功能运行正常，但始终无法实现为第一页之后的所有页面添加上下内边距的效果，最终生成的PDF效果如下：

另一效果示例：

无法通过Python代码配置margin参数添加边距，因为该操作会破坏文件的背景显示效果。

当前使用的pdfkit配置代码 #

options = {
    'page-size': 'A4',
    'margin-top': '0in',
    'margin-right': '0in',
    'margin-bottom': '0in',
    'margin-left': '0in',
    'encoding': "UTF-8",
    'no-outline': None,
    'dpi': 150,
    "disable-smart-shrinking": True
}
pdfkit.from_string(_html, temp_path, options=options,)

以下方案均不需要修改现有全局margin配置，不会破坏页面背景铺满效果：

• 方案1：通过CSS @page 规则差异化配置页面边距
  pdfkit底层依赖的wkhtmltopdf原生支持@page伪类选择器，可以单独给非首页设置边距，同时通过打印背景扩展属性保证背景不被截断，直接在HTML模板的<style>标签中添加如下代码即可：

  /* 全局页面保持0边距，保证背景铺满整页 */
  @page {
      margin: 0;
      bleed: 0; /* 允许背景延伸到页面边缘，不受边距限制 */
  }
  /* 第一页保持原有0边距配置 */
  @page :first {
      margin-top: 0;
      margin-bottom: 0;
  }
  /* 非首页设置需要的上下内边距，左右边距保持0 */
  @page :left, @page :right {
      margin-top: 18mm; /* 根据需求调整页眉侧内边距 */
      margin-bottom: 18mm; /* 根据需求调整页脚侧内边距 */
  }
  /* 页面根节点设置背景铺满，避免被边距截断 */
  html, body {
      margin: 0;
      padding: 0;
      /* 你的原有背景配置保持不变 */
      background-size: 100% 100%;
      background-repeat: no-repeat;
  }
  

• 方案2：固定定位占位元素+CSS分页规则
  如果@page规则在你的业务场景下存在兼容性问题，可以完全通过CSS固定定位元素实现边距占位，不需要调整任何pdfkit配置：

  /* 上下边距占位块，背景和页面保持一致，不会露出白边 */
  .gap-placeholder {
      position: fixed;
      left: 0;
      width: 100%;
      height: 18mm; /* 内边距高度 */
      background: inherit;
      z-index: 99;
  }
  .gap-top {
      top: 0;
  }
  .gap-bottom {
      bottom: 0;
  }
  /* 第一页隐藏占位块 */
  .page-1 .gap-placeholder {
      display: none;
  }
  /* 正文内容添加上下内边距，避免被占位块遮挡 */
  .content {
      padding: 0;
  }
  .page:not(.page-1) .content {
      padding-top: 18mm;
      padding-bottom: 18mm;
  }
  /* 手动分页时给分页后的内容块自动添加非首页标记 */
  .page-break {
      page-break-after: always;
  }
  

  只需要在HTML模板中给每页内容加上page类名，第一页额外加page-1类名，在每页顶部和底部插入占位div即可。

• 方案3：利用pdfkit原生页眉页脚配置做占位
  pdfkit支持单独配置页眉页脚与内容的间距，且支持第一页单独设置页眉页脚，不需要修改全局margin：

  options = {
      'page-size': 'A4',
      'margin-top': '0in',
      'margin-right': '0in',
      'margin-bottom': '0in',
      'margin-left': '0in',
      'encoding': "UTF-8",
      'no-outline': None,
      'dpi': 150,
      "disable-smart-shrinking": True,
      # 配置页眉页脚与正文的间距，单位mm
      'header-spacing': 8,
      'footer-spacing': 8,
  }
  # 调用生成方法时，第一页传空页眉页脚，非首页传和内边距等高的透明占位块
  pdfkit.from_string(
      _html,
      temp_path,
      options=options,
      first_page_header='',
      first_page_footer='',
      header='<div style="height:18mm;background:transparent;"></div>',
      footer='<div style="height:18mm;background:transparent;"></div>'
  )
  

  该方案实现成本最低，不需要修改原有HTML模板结构，背景会正常铺满整页，不会被页眉页脚区域截断。

内容的提问来源于stack exchange，提问作者Kjobber