Question

我正在使用表中的引导程序使用客户端分页。我希望在每个页面中添加序列号，以便在第1页上添加S.No从1到50然后从第2页开始s.No应该是51到100。 ......等等

我已经改变了我的CSS

.table {
 counter-reset: serial-number;  /* Set the serial number counter to 0     */
}

.table td:first-child:before {
 counter-increment: serial-number;  /* Increment the serial number   counter */
  content: counter(serial-number);  /* Display the counter */
 }

但现在问题出现在第2页，S.No从1到50再次开始，所以在第3页。有人可以帮助我在其他页面上实现正确的序列号系列。

Answer 1

您可以在counter-reset属性中手动播种计数器：

counter-reset: serial-number 50; /* Set counter to 50 */

当然你必须手动计算这个初始值。在javascript分页回调中，您可以使用以下内容进行更新：

document.querySelector('.table').style.counterReset = 'serial-number ' + (zeroIndexedPageNo * pageSize);

Demo

每页上的序列号相同

1 个答案: