如何在@media打印中打印页码？

Question

我想在打印时显示页码。我可以使用计数器来获取页码，但是我想不出一种在每页中以任何适当方式显示它的方法。

我遵循了。但它不起作用。检查了Firefox和Chrome。

https://developer.mozilla.org/en-US/docs/Web/CSS/@page

@page {

    @top-right {
        counter-increment: page;
        content: counter(page);
    }

}

Answer 1

尝试一下 确保先更新浏览器，然后编写以下代码 尽管这是针对页脚的，但您也可以将其调整为也适用于右上角

 @content {
 display: table;
 }

 @pageFooter {
 display: table-footer-group;
 }

 @pageFooter:after {
 counter-increment: page;
 content: counter(page);
 }

您可以如下创建右上角的课程

 @topright {
 position: absolute;
 top: 8px;
 right: 16px;
 font-size: 18px;
 }

祝你好运