个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
25
4
这是一段 HTML/CSS 代码，由于 CSS 的计数器，它应该在打印时在页脚中打印页码:
<html>
<head>
<style type="text/css">
body {
counter-reset: page;
}
div.footer {
display: table-footer-group;
position: fixed;
bottom: 0pt;
right: 0pt;
}
div.footer:after {
counter-increment: page;
content: "Page " counter(page);
}
p {
page-break-after: always;
}
</style>
</head>
<body>
<div class="footer"></div>
<p>Hello world page 1</p>
<p>Hello world page 2</p>
</body>
</html>
事实是，在 Firefox 79.0 中，我在第一页上看到“Page 1”，在第二页上看到“Page”。使用 Chrome 84.0，我在两个页面上都显示“Page 1”。
我尝试使用 @page at-rule，原生“页面”计数器(如 w3 中所述)，我仍然找不到我丢失的东西。
非常感谢您的帮助:)
最佳答案
我认为您无法实现您的目标。您获得“第 1 页”的原因是因为您在 div.footer:after 声明中递增计数器，它在您的 HTML 代码中只出现一次。
CSS 计数器在读取时是根据该元素在文档中的位置计算的，如规范中所述:https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Lists_and_Counters/Using_CSS_counters
所以在你的情况下，你可以这样想:
div.footer:after {
content: "Page " counter(page); /* when displayed, read the value of `page` */
}
p {
counter-increment: page; /* counter increments with every occurrence of a <p> tag */
}
和
<div class="footer"></div> <!-- `page` counter is always 0, as no occurrences of a <p> tag yet -->
<p>Hello world page 1</p> <!-- sets counter to 1 -->
<p>Hello world page 2</p> <!-- sets counter to 2 -->
或
<p>Hello world page 1</p> <!-- sets counter to 1 -->
<div class="footer"></div> <!-- `page` counter is always 1, as there was a single occurrence of a <p> tag -->
<p>Hello world page 2</p> <!-- sets counter to 2 -->
或
<p>Hello world page 1</p> <!-- sets counter to 1 -->
<p>Hello world page 2</p> <!-- sets counter to 2 -->
<div class="footer"></div> <!-- `page` counter is always 2, as there were two occurrences of a <p> tag -->
关于html - 无法找到使反增量工作的方法(Chrome/Firefox)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/63473414/
25
4
0
这个问题已经有答案了: What is x after "x = x++"? (18 个回答) 已关闭 6 年前。 public static void main(String[] args)
我目前正在使用 jquery 循环插件。我有 3 个不同的幻灯片，它们彼此相邻并同时循环播放。我想做的是先关闭第一张幻灯片，然后是第二张幻灯片，然后是第三张幻灯片。无论如何，我可以通过增量或超时来做到
这个问题在这里已经有了答案: 关闭 11 年前。 Possible Duplicate: ++someVariable Vs. someVariable++ in Javascript 我知道您可以
我一直在查看 SVN 手册，但无法找到“svn log”和“svn st”的“--incremental”选项的简单用法示例或解释。 我正在编写一个开源 SVN GUI 前端，因此我需要一些有关此标志
我有这种矩阵。 非常抱歉，我没有可重现的示例。 表 1: [,1][,2][,3][,4][,5][,6][,7][,8][,9][,10] [1,] 3 NA NA NA
我在hdfs中有一个 Parquet 文件作为我的数据的初始加载。接下来的所有拼花地板只是这些数据集每天都会更改为初始负载(按时间顺序)。这是我的三角洲。 我想读取全部或部分 Parquet 文件，以
我目前有这样的功能，可以将任何输入数字四舍五入到最接近的模糊整数值: $(function(){ $('#my_value').blur(function() { $(this).va
已关闭。此问题不符合Stack Overflow guidelines 。目前不接受答案。 要求提供代码的问题必须表现出对所解决问题的最低限度的了解。包括尝试的解决方案、为什么它们不起作用以及预期结果
我对 SQL 还很陌生，我想知道我是否可以使用它来自动解决我数据库中的一个复杂问题。 也就是说，我每天都在跟踪条目。因此，我们关注的列是: YYYY MM DD XXX YYYY 是年，MM 是月，D
我正在开发一个非常简单的数据库，但我不知道数据透视表是否是一个很好的解决方案。如果我使用数据透视表，我需要添加无用的表只是为了增量。 让我们从头开始。 在用户注册期间，会创建一个新表 GROUP。在G
在 MySQL 中你可以做这样的事情 SELECT @n := @n + 1 n, first_name, last_name FROM table1, (SELECT
如果我正在使用一个类，我知道如何重载运算符 += class temp { public: int i; temp(){ i = 10; } int operator+=(in
我有两个文件:file1、file2。我想从 file2 中获取 file1 中不存在的行。 我读过 post这告诉我使用 grep 的 -v 标志来执行此操作(我阅读了 grep 的手册页，但仍然不
我看了很多类似的题，功能很简单，用于API的嵌套for循环，每分钟可以调用5次。所以我将一年数据的范围设置为 75。你们能帮我解决这个问题吗？提前致谢! 第一部分正在运行，输入列表中的邮政编码。 fo
所以我想计算每日返回/增量的一些时间序列数据，其中每日增量 = value_at_time(T)/value_at_time(T-1) import pandas as pd df=pd.DataFr
请帮我解决这个问题。该表达式之后的步骤是: //Expression offSpring1[m1++] = temp1; //Steps: 1.- increment m1 2.- assign te
我正在开发一个解决方案，在该解决方案中，我通过 webapp 不同类型的实体(例如中央数据库上的用户、组、部门信息)和 ldap 进行身份验证。但是最终用户将与来自远程位置(他的办公室、节点)的数据交
我有以下 Python 数据结构: data1 = [{'name': u'String 1'}, {'name': u'String 2'}] data2 = [{'name': u'String
如果 AtomicInteger 会发生什么？达到 Integer.MAX_VALUE 并递增？ 值会回到零吗？ 最佳答案 由于integer overflow，它会环绕, 到 Integer.MIN
我是 C 的初学者，我正在尝试在 While 循环中进行 0.00001 增量。例如，double t = 0.00001 并且我希望循环每次以 0.00001 的增量运行，第二次是 0.00002
我是一名优秀的程序员,十分优秀！