打印大型HTML表时如何处理分页符我有一个项目,它需要打印一个包含许多行的HTML表。我的问题是表格在多页上的打印方式。它有时会将一行切成两半,这使得它无法读,因为其中一半在页面的边缘,其余的则打印在下一页的顶部。我能想到的唯一可行的解决方案是使用堆叠的div,而不是表和强制分页(如果需要的话)。但在我经历所有的改变之前,我想我可以在这里问一问。
3 回答

Qyouu
TA贡献1786条经验 获得超11个赞
<!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>Test</title><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></head><body> <table> <thead> <tr><th>heading</th></tr> </thead> <tfoot> <tr><td>notes</td></tr> </tfoot> <tbody> <tr> <td>x</td> </tr> <tr> <td>x</td> </tr> <!-- 500 more rows --> <tr> <td>x</td> </tr> </tbody> </table></body></html>

月关宝盒
TA贡献1772条经验 获得超5个赞
<html><head><style>@media print{ 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 } tfoot { display:table-footer-group }}</style></head><body>....</body></html>

慕妹3146593
TA贡献1820条经验 获得超9个赞
<!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>Test</title><style type="text/css"> table { page-break-inside:auto } div { page-break-inside:avoid; } /* This is the key */ thead { display:table-header-group } tfoot { display:table-footer-group }</style></head><body> <table> <thead> <tr><th>heading</th></tr> </thead> <tfoot> <tr><td>notes</td></tr> </tfoot> <tr> <td><div>Long<br />cell<br />should'nt<br />be<br />cut</div></td> </tr> <tr> <td><div>Long<br />cell<br />should'nt<br />be<br />cut</div></td> </tr> <!-- 500 more rows --> <tr> <td>x</td> </tr> </tbody> </table></body></html>
page-break-inside:avoid
display:block
TR
page-break-inside:avoid
- 3 回答
- 0 关注
- 409 浏览
相关问题推荐
添加回答
举报
0/150
提交
取消