分页时打印时Html表行的问题

Question

我有一个包含大量行的表，可以在打印期间跨越多个页面。我有一些问题让表格在分页符上呈现正确。

第一个问题是我在每个页面上都重复了这个问题，但有时它会将它打印到上一页的最后一行，有时只是写在最后一个数据行上。

我遇到的另一个问题是我在页面上将顶部和底部边距设置为1厘米，但行在边距下方消失。所以，如果我将上一页的最后一行作为第18行，我会在下一页上获得第21行。第19和第20行在边缘下方消失。 这是边缘css：

  @page {
      size: auto;
      margin: 1cm 0;
  }
  @page:first {
    margin: 0;
  }

如果我不使用@page：首先，那么关于在边距下消失的行的第二个问题会得到修复，但我不需要第一页上的边距。

这是与我的桌子有关的CSS：

 table { page-break-after:auto }
  tr    { page-break-inside:avoid; page-break-after:auto;}
  td    { page-break-inside:avoid; page-break-after:auto; }
  thead { display:table-header-group }

我正在使用chrome。

Answer 1

尝试将const input = [1, 5, 3, 2]; const result = input.reduce((arr, x, i) => i == 0 ? [x] : [...arr, x + arr[arr.length - 1]] , null) console.log(result);添加到border-collapse: collapse;。无论出于何种原因为我工作。