Chrome 不支持 css @page?

2024-02-20

我有用于打印的CSS,就像这样简单:

@page {
  @top-left {
    content: "TOP SECRET";
    color: red
  }
  @bottom-center {
    content: counter(page);
    font-style: italic
  }
}

但Chrome打印预览和保存到pdf似乎根本无法识别这一点。打印时如何正确设置页眉和页脚?

EDIT: @page无人支持ref http://en.wikipedia.org/wiki/Comparison_of_layout_engines_%28Cascading_Style_Sheets%29

但是,我还有其他选择吗?我不从事网站工作。该产品只需要 pdf 作为结果。我可以接受chrome, webkit, plantomjs etc.


您可以使用开放工具 PagedJS 来渲染 iframe 或使用 CSS paged-media 规范的整个页面。https://pagedjs.org/ https://pagedjs.org/

这个工具是一个polyfill,可以将您发布的块(浏览器未实现的CSS分页媒体)转换为与浏览器兼容的html/css。

它还有一个 CLI 替代方案,可以设置 puppeteer 并创建 PDF 输出:https://gitlab.coko.foundation/pagedjs/pagedjs-cli https://gitlab.coko.foundation/pagedjs/pagedjs-cli

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Chrome 不支持 css @page? 的相关文章