Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/amazon-web-services/14.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Html CSS打印带有备注的多页表格_Html_Css - Fatal编程技术网

Html CSS打印带有备注的多页表格

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 {

我必须打印一个大的HTML表格,这个表格要经过好几页。每一页上都应该有备忘录(页眉和页脚上写着公司名称和材料)。我将
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。还有一个问题使得
只出现在最后一页,而不是每页。