8

我在 IE9、Firefox 和 Opera 上没有这个问题。只有 Chrome 和 Safari。

打印页面时，如果有表格需要在某个时间点被打破才能在下一页继续，Safari 和 Chrome 会将行切成两半，并在第一页打印上半部分，在第二页打印下半部分页。

这是我尝试使用的代码，它确实解决了我在使用 IE9 时遇到的问题 - 在下一页的每一行中打印一个 50 像素 x 50 像素的小图像，并在第一页上显示文本。

table { page-break-inside:auto }
tr    { page-break-inside:avoid; page-break-after:auto }

我有 7 页不同数量的行，平均大约 10-15 行。我能做些什么来解决这个问题？

而且我使用 PHPforeach从数组创建表，所以我宁愿不必编辑该代码，以便在页面之间保持一致。

4

2 回答 2

2

这是一个只允许在行之间分页的表格示例。它应该适用于任何流行的桌面浏览器，包括基于 webkit 的浏览器......

<style>
  table {
    border-spacing: 0;
    line-height: 1.25em;
  }
  table > tbody > tr > td {padding: 0;}
  table > tbody > tr:first-child > td > div {border-top: 2px solid black;}
  table > tbody > tr > td:first-child > div {border-left: 2px solid black;}
  table > tbody > tr > td > div {
    page-break-inside: avoid;
    display: inline-block;
    vertical-align: top;
    height: 3.75em;
    border-bottom: 2px solid black;
    border-right: 2px solid black;
  }
</style>

<table>
  <tr>
    <td><div>Content</div></td>
    <td><div>Multi-<br/>line<br/>content</div></td>
  </tr>
  <tr>
    <td><div>Content</div></td>
    <td><div>Multi-<br/>line<br/>content</div></td>
  </tr>
</table>

不幸的是，它要求单元格内容的高度是固定的，这对于大多数遇到这篇文章的人来说可能毫无用处。

可以在不设置固定内容高度的情况下完成此操作，但它非常复杂。在这篇文章中查看我的答案，看看它是如何完成的。

于 2014-09-10T04:25:40.173 回答
0

查看这些错误报告 Webkit 错误报告

Webkit 较新的 Bug 报告引用了上面的一个。

于 2013-10-18T10:43:33.173 回答