是否有任何正在工作的CSS方法来打印页面计数?

Eli*_*res 5 printing html5 pagination css3

我一直在寻找使用CSS打印页面计数的任何解决方案,但是找到的每个“解决方案”都无法在任何浏览器中使用,没有有效的解决方案,只有技巧。

显然,

@page {
    @bottom-left {
        content: "blablabla"
    }
}
Run Code Online (Sandbox Code Playgroud)

是有效的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>
Run Code Online (Sandbox Code Playgroud)

rne*_*ius 1

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

您可以使用以下内容:

@bottom-right-corner
@bottom-right
@bottom-center
@bottom-left
@bottom-left-corner
Run Code Online (Sandbox Code Playgroud)

  • 抱歉,我想到了“@bottom-left”并写了“@bottom”。即使在最简单的 HTML 示例中我也无法使其工作! (2认同)