仅在最后打印的页面中打印页脚以进行媒体打印

Question

我需要打印多页，页脚需要打印在最后一页底部。 我已经为这样的页脚添加了 css

footer {
     display: block;
     width:100%;        
     position:absolute;
     left:0;
     bottom:0px;        
}

问题是页脚正在打印第一页，但我需要在最后一页上打印。

Answer 1

包括带有自定义样式的样式表，以便使用media="print" as

<link rel="stylesheet" href="yourpath/footerstyle.css" media="print"/>

或者

在 html 中嵌入样式

<style>
@media print {
   footer {
    display: block;
    width:100%;        
    position:absolute;
    left:0;
    bottom:0;        
   }
}
</style>

或者

<style type="text/css" media="print">
    footer {
        display: block;
        width:100%;        
        position:absolute;
        left:0;
        bottom:0;         
    }
</style>

尝试将 body 相对定位，footer 绝对定位：

<style type="text/css" media="print">
     body {
        position: relative;
     }
     footer {
        display: block;
        width:100%;        
        position:absolute;
        left:0;
        bottom:0;         
     }
</style>

或者你可以使用这样的东西：

@page:last {
    @bottom-center {
        content: "…";
    }
}

CSS 3 分页媒体模块

编辑

<style type="text/css" media="print">
     body {
        position: relative;
        margin: 0;
     }
     .page-section {

        /* Specify physical size of page, margins may vary by browser */

        height: 10 in; /* or give size as per proper calculation of the height of all your pages after which you want footer */
        position: relative;
     }
     footer {
        display: block;
        width:100%;        
        position:absolute;
        left:0;
        bottom:0;         
     }
</style>

将.page-section添加到相关的 div / div，根据您希望 div 每页打印或直接添加到body标签。