是否有任何有效的 CSS 方法来打印页面计数？答案

【问题标题】：Is there any WORKING CSS method to print page counting?是否有任何有效的 CSS 方法来打印页面计数？
【发布时间】：2014-11-21 14:40:17
【问题描述】：

我正在寻找任何使用 CSS 打印页面计数的解决方案，但找到的每个“解决方案”都不适用于任何浏览器，没有有效的解决方案，只有提示。

显然，

@page {
    @bottom-left {
        content: "blablabla"
    }
}

是有效的 CSS3 规则，但不适用于任何浏览器。

有人可以帮我吗？

这是一个不工作的例子：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Test example</title>
    <style>
        @page {
            @bottom-left {
                counter-increment: page;
                content: counter(page);
            }
        }
    </style>
</head>
<body>
    <div id="content">
         <!-- LONG CONTENT HERE -->
    </div>
</body>
</html>

【问题讨论】：

嗨，我遇到了同样的问题。您找到解决此问题的方法了吗？
很遗憾没有！ :(
是的，我已经找到了。似乎没有主流浏览器支持这些边距框 - margin boxes support comparison

标签： html css printing pagination

【解决方案1】：

@page { @bottom {} } 不是有效的 CSS3。

你有以下available to you：

@bottom-right-corner
@bottom-right
@bottom-center
@bottom-left
@bottom-left-corner

【讨论】：

对不起，我想@bottom-left 并写了@bottom。即使在最简单的 HTML 示例中，我也无法使其工作！