在打印

Question

我有一个包含可变行数的表。我想通过浏览器打印该表。在它下面，有一个div应该保留在页面的底部。如果表格包含在第一页中，则div将位于第一页的底部。如果表溢出到第二页，div将是第二页的底部，依此类推，...... 我的第一种方法就像我以前用HTML一样处理它

.footer{
   width: 100%;
      position: absolute;
      bottom: 0;
      font-size: 10pt;
 }

这不起作用。页脚保留在第一页。需要你的帮助！

修改

我在父div中制作了表格和页脚，以便它们可以循环播放。页脚将始终与表的末尾位于同一页面上。对不起，我的不准确！

已解决[已编辑]

我终于通过另一个div围绕页脚并按照以下方式执行一些CSS来实现：

.table{
        min-height: 20cm !important;/* Define height for the table in cm or mm (I encountered a problem with px and %) */
        display: block;
        position: relative;
        width: 100% !important;
    }
    .footer{
        width: 100%;
        position: relative;
        margin-bottom: 0 !important;
        font-size: 10pt;
        page-break-inside: avoid !important;
        page-break-before: auto !important; /* this pushes the footer to the bottom of next page if table overflows to another page */
    }

唯一剩下的问题是当表格与第一页完全匹配时：页脚被推到下一页但显示在顶部:( 谢谢你们所有的答案！ ：）

Answer 1

尝试将position: fixed;用于此div。

如果设置bottom: 0;

，则应将其置于打印页面的底部

Answer 2

我让我的页脚粘在div的底部并跟随它。

如果我理解正确，你希望页脚位于表格的末尾，这就是我如何做到的：

#footer {

    background-color: #333;
    clear:both;
    bottom: 0;
    width: 1200px;
    height: 50px;
    margin: 0 auto;
    border-radius:0px 0px 10px 10px;
}

和页脚内的paragraf：

#paragraf_1 {
        display:block;
    color:white;
    text-align:bottom-left;
    padding:14px 16px;
    text-decoration:none;
}