html - 从 Google Chrome 打印时的页码

Question

我看过这个答案...

@page {
  @bottom-left {
    content: counter(page) "/" counter(pages);
  }
}

很多次，但它从来没有为我输出任何东西到页面上，即使它应该工作。我已经尝试过在底部获取页码的“创造性”方法，但我永远无法让它可靠地工作。计数很好，但位置总是关闭，所以我已经报废了。

这个 CSS 不应该工作的任何原因？如前所述，我正在使用 Google Chrome 进行打印。

Answer 1

您可以从这里尝试答案... CSS 页码的浏览器支持

@page {
    counter-increment: page;
    counter-reset: page 1;
    @bottom-left {
        content: "Page " counter(page) " of " counter(pages);
    }
}

正如该答案所述，您需要在使用之前重置计数器（根据https://developer.mozilla.org/en-US/docs/CSS/Counters）