打印表格时，chrome和safari会将一行切成两半。
打印表格时，chrome和safari会将一行切成两半。
提问于 2013-03-10 10:17:56
我对IE9、火狐和Opera没有这个问题。只有Chrome和Safari。
在打印页面时，如果有一个表格需要在某一时刻被拆分才能在下一页继续，Safari和Chrome会将该行切成两半，并将上半部分打印在第一页，将下半部分打印在第二页上。
这是我尝试使用的代码，它确实解决了我在IE9中遇到的一个问题-在下一页的每一行中打印一个50px x 50px的小图像，文本在第一页上。
table { page-break-inside:auto }
tr { page-break-inside:avoid; page-break-after:auto }我有7页不同数量的行，平均约10-15行。我能做些什么来解决这个问题？
我使用PHP foreach从数组创建表，所以我不想编辑代码，这样就可以在页面之间保持一致。
Stack Overflow用户
发布于 2014-09-10 12:25:40
下面是一个只允许在行之间换页符的表的示例。它应该可以在任何流行的桌面浏览器中工作，包括基于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>不幸的是，它需要在单元格内容上设置固定的高度，这可能会使它对大多数读过这篇文章的人来说毫无用处。
可以在不设置固定内容高度的情况下实现这一点，但它出人意料地复杂。请查看我在this post中的答案，看看它是如何完成的。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/15318183
复制相关文章
相似问题
腾讯云开发者
