Question

我正在尝试避免在HTML表格的行内部出现分页符，这可能会超过一页。我正在使用Internet Explorer打印预览和BCL EasyPDFSDK转换为PDF来测试它。我将以下CSS样式以各种组合应用于<td>元素，但是对于每个元素，我都得到了不希望的结果：

td {
    page-break-inside: avoid !important;
    white-space: nowrap;
    overflow: hidden;
    margin: 4px 0 4px 0;
}

我相信page-break-inside: avoid !important正在运作，但仅限于<td>级别。例如，我会看到<tr>在第一页末尾有一个<td>，所有文字都完好无损，但下面的<td>代码会出现在下一页上他们所有的文字完整无缺。

我认为您不应该将格式应用于<tr>，所以我不确定如何解决这个问题。

我应该将CSS应用于<tr>还是有另一种方法来实现这一目标？

感谢您的帮助！

Answer 1

原来我需要折叠表格元素上的边框，并使用

将填充减少到仅1px

table { border-collapse: collapse; }
td {
    page-break-inside: avoid !important;
    white-space: nowrap;
    overflow: hidden;
    padding: 1px;
    font-size: xx-small;
}

我还将字体大小设置为xx-small，以防出现问题。当我折叠边框时，这个问题似乎主要得到了解决，所以我想知道这个表是否因为这个问题而分裂了行。

干杯！

编辑：

自从处理这个问题以来，我发现在较新的Web浏览器中，行拆分处理得更好。如果您遇到此问题，我强烈建议将IE更新至至少11个。

Answer 2

我刚刚将以下CSS添加到我的@media打印文件中，并且有效！！！

没有一种适用于td，th，tr的解决方案

table {
  page-break-inside: avoid !important;
}

用于停止表格行

2 个答案: