如何避免跨页面拆分HTML表 [英] How to avoid splitting an HTML table across pages

问题描述

请原谅我的英语.

我正在以pdf格式打印一份大型报告，其中包括一些表格(一个表格又一个表格).为此，我首先使用html生成了报告，然后使用 dompdf

这是我一张一张一张地打印一张纸的方式:

 < div>< table>-----</table></div>< div>< table>-----</table></div> 

这是出现分页符时打印表的方式

问题是，当有分页符时，表行将被拆分.我想避免它.

我尝试使用CSS打印属性，但是它不起作用，在其他情况下为 page-break-before:always; 将报告的每个表打印在不同的页面上.

 < style type ="text/css">表格{page-break-inside:auto}tr {page-break-inside:avoid;page-break-after:auto}thead {display:table-header-group}tfoot {display:table-footer-group}</style> 

因为只有在必要时，我才能在报表的所有表中强制分页符.

请帮助.

解决方案

检查此链接: Link1
Link3

与您的问题有关的答案很多，因此请首先尝试此答案.您可以使用CSS进行尝试:

 < table class ="print-friendly"><！-表格的其余部分-></table>< style>table.print-friendly tr td，table.print-friendly tr th {page-break-inside:避免；}</style> 

大多数CSS规则并不直接应用于< tr> 标记，因为正是您在上面指出的内容-它们具有独特的 display 样式，不允许使用这些CSS规则.但是，其中的< td> 和< th> 标签通常可以允许这种规范-您可以轻松地应用这样的规范如上所示，使用CSS对所有子级< tr> 和< td> 的规则进行设置.

Please excuse my English.

I am printing a large report in pdf format including some tables (table after table). To do this, I first generated the report in html, then passed it on to pdf using dompdf

This is the way I print one table after another:

<div>
  <table>
  -----
  </table>
</div>

<div>
  <table>
  -----
  </table>
</div>

This is the way in which printed tables when there is a page break

The problem is that when there is a page break, the table rows are split. I want to avoid it.

I tried using the CSS Print Properties, but it does not work, in other cases as page-break-before: always; print each table of my report on a different page.

<style type="text/css">
table { page-break-inside:auto }
tr    { page-break-inside:avoid; page-break-after:auto }
thead { display:table-header-group }
tfoot { display:table-footer-group }
</style>

As I can force page breaks in all tables in my report only if necessary.

Please help.

解决方案

Check this links: Link1
Link2
Link3

There is lot of answer related to your question so try this answers first. You might try this with CSS:

<table class="print-friendly">
 <!-- The rest of your table here -->
</table>

<style>
    table.print-friendly tr td, table.print-friendly tr th {
        page-break-inside: avoid;
    }
</style>

Most CSS rules don't apply to <tr> tags directly, because of exactly what you pointed out above - they have a unique display style, which doesn't allow for these CSS rules. However, the <td> and <th> tags within them usually do allow this kind of specification - and you can easily apply such rules to ALL child-<tr>'s and <td>'s using CSS as shown above.

这篇关于如何避免跨页面拆分HTML表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！