Html CSS打印带有备注的多页表格
我必须打印一个大的HTML表格,这个表格要经过好几页。每一页上都应该有备忘录(页眉和页脚上写着公司名称和材料)。我将Html CSS打印带有备注的多页表格,html,css,Html,Css,我必须打印一个大的HTML表格,这个表格要经过好几页。每一页上都应该有备忘录(页眉和页脚上写着公司名称和材料)。我将jquerydatatables与TableTools一起使用。这是我的css @media print { @page{ margin: 150px 0px 150px 0px !important; padding: 0px !important; size: A4 portrait; } table {
jquerydatatables
与TableTools
一起使用。这是我的css
@media print
{
@page{
margin: 150px 0px 150px 0px !important;
padding: 0px !important;
size: A4 portrait;
}
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-row-group;
}
html{
background-image: url(memo.png) !important;
background-size: 200mm 287mm !important;
}
}
但是,当将上边距设置为@page
时,它会将所有内容(包括背景)向下“移动”。我想知道是否有一种方法可以将@page
中的边距应用于表格,但在设置背景时可以避免,或者将背景图像添加到@page
我还尝试将@page
页边距设置为0,将表边距设置为150px。在第一页上可以,但由于表被拆分为几页,所以忽略了其他页上的页边距
更新
我添加了一些错误和想要的结果的草图。红色是页眉,蓝色是页脚,绿色是表格您可以添加一个空的(第一行)吗?在屏幕上查看表格时将其隐藏,打印时将其高度设为150px
表格跨越的每一页上都会重复THAD。这意味着每一页都以空行开始,为公司徽标腾出空间并向下推送数据
类似地,添加一个空的最后一行到你的代码> <代码>,以在表格的每一页的底部腾出空间。
不幸的是,这不是一个选项,因为它会破坏PDF和Excel Excel。还有一个问题使得
只出现在最后一页,而不是每页。