[英]Print footer only in last printed page for media print
I need to print multiple pages and footer needs to be print in last page bottom.我需要打印多页,页脚需要打印在最后一页底部。 I have add css for footer like this我已经为这样的页脚添加了 css
footer {
display: block;
width:100%;
position:absolute;
left:0;
bottom:0px;
}
Issue is footer is printing first page, but i need this on last page.问题是页脚正在打印第一页,但我需要在最后一页上打印。
Include a stylesheet with your custom style for footer for print using media="print"
as包括带有自定义样式的样式表,以便使用media="print"
as
<link rel="stylesheet" href="yourpath/footerstyle.css" media="print"/>
or或者
embed styles as in html在 html 中嵌入样式
<style>
@media print {
footer {
display: block;
width:100%;
position:absolute;
left:0;
bottom:0;
}
}
</style>
or或者
<style type="text/css" media="print">
footer {
display: block;
width:100%;
position:absolute;
left:0;
bottom:0;
}
</style>
Try to position the body relative and the footer absolute:尝试将 body 相对定位,footer 绝对定位:
<style type="text/css" media="print">
body {
position: relative;
}
footer {
display: block;
width:100%;
position:absolute;
left:0;
bottom:0;
}
</style>
or you could use something like this:或者你可以使用这样的东西:
@page:last {
@bottom-center {
content: "…";
}
}
CSS 3 Paged Media module CSS 3 分页媒体模块
Edit编辑
<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>
add .page-section
to relevant div / divs as per you want divs to print per page or directly add to body
tag.将.page-section
添加到相关的 div / div,根据您希望 div 每页打印或直接添加到body
标签。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.