java - 飞碟:rowsapn 和 page-break-inside
问题描述
我正在使用飞碟将 html 页面转换为 PDF。有两个巨大的列在表格的整个部分上是行跨度的。所有列都有
table td {
border: 1px solid black;
page-break-inside: avoid;
vertical-align: middle;
}
应用的样式。因此,对于所有其他列,这都可以正常工作并且它们被正确截断。虽然 rowspanned 列不会在每页上停止在相同的高度(见截图)
有什么建议可以解决吗?
解决方案
一种可能的解决方法是根本不使用行跨度,而是隐藏第三列中单元格的边框。所以:
- 从单元格中删除行跨度;
- 包括
<td></td>
应分组的单元格的偶数; - 添加以下样式:
``
tr:nth-child(n+5) td:nth-child(n+3) {
border-top: none;
}
tr:not(:last-child) td:nth-child(n+3) {
border-bottom: none;
}
在第一个语句中,n+5
意味着从第 5 行开始隐藏边框,因此只有前 4 行会保留边框。如果你觉得更舒服,你可能会想到其他类型的选择器。
注意:我不知道上述规则是否适用于飞碟,它们至少适用于 Chrome 打印窗口,它基本上是一个 html 到 pdf 转换器。就试一试吧。
推荐阅读
- sql-server - 在日志中获取太多打开的文件错误
- java - 如何在 toast 中设置重力,我可以更改警报对话框的位置吗?
- flutter - pub.dev 将用户/贡献者/上传者添加到包中
- web - 为什么我在通过 Github 存储库在 Heroku 上托管我的网站时出错?
- github - 这些文件是如何不断更新的?
- arrays - 如何更改数组中特定元素的值?
- python - Scrapy:response.xpath 打印无,但在点击网络链接时,xPath 是正确的
- javascript - 为什么在 forEach 循环完成之前执行代码?
- flutter - 如何从小部件导航到另一个页面
- python - 如何使用 Seaborn 在条形图上显示每组的中值