如何在分页发生后为第一个孩子设置样式?
我面临的最终情况是我想以不同的方式设置表格的第一行样式,并且当打印表格时跨越多个页面.我成功地使用了:first-child来设置第一行的样式.我也成功地避免了行内的分页符.但是我无法弄清楚如何在表格的第二页上设置第一行的样式.
我熟悉css伪类的第一个孩子(http://www.w3schools.com/cssref/sel_firstchild.asp),我也熟悉css print属性page-break-inside(http://www.w3schools.com/cssref/pr_print_pagebi.asp).我不能让他们一起玩得很好吗?
HTML:
最佳答案
好吧,直接回答 – 你不能按照自己的意愿去做.
编辑:哦,看起来我回答了一个更复杂的问题,如“如何在每个打印页面上添加表格标题”,但是,无论如何解决方案是一样的.希望没关系.
但是有几个技巧可以做你想要的.
1)在几个部分中断表,将每个部分添加到每个部分并删除边距,因此它看起来只有一个表.添加css类似于:
table {
page-break-inside: avoid;
page-break-after: auto;
}
table + table thead {
display: none;
}
另外不要忘记设置td宽度,因为没有thead的表可以有不同的宽度.
之后添加打印样式:
@media print {
table + table thead {
display: table-column-group;
}
}
是的,页面上有重复标题的可能性,但它总比没有好.如果您为项目找到了很多行,它将根据您的需要进行查找
2)例如,准备具有WKHTMLTOPDF的专用下载的可打印版本的页面.因此,您可以很好地捕获分页符,并添加您需要的内容.此选项可提供最大的输出灵活性,但需要一些时间来提供支持.
3)用JS计算一切.打印页面并进行分析 – 向js(每页高度)添加一些常量,当有人尝试打印时 – 计算分页符,找到最接近的元素并添加所需内容.
希望你有答案.
祝你今天愉快.
猜你在找的CSS相关文章