我有一个客户想要打印的网页,而我无法理解的部分是让页脚位于最后打印页面的底部,而不仅仅是内容结束时
我试过类似的东西
#printfooter{display: block; position:fixed; bottom: 0;}
Run Code Online (Sandbox Code Playgroud)
但它在每页末尾显示页脚.
也许我对CSS要求太多了......它可行吗?
我想我应该为<br />的(^_^)发疯
我所拥有的是<table>它有时可能只在一个页面上大或小,有时它可能会增长到10页左右.
这是一个示例代码:
div{
position:relative;
height:100vh;
}
.table-blue{
width:100%;
background:lightblue;
}
.table-blue td{
padding:5px 10px;
}
.table-blue-fotter{
position: absolute;
bottom: 20px;/* for bottom gap */
left: 0px;
width:100%;
background:gray;
}
@media print {
.table-blue-fotter{
position: fixed;
bottom: 20px;
left:0px;
width:100%;
background:gray;
}Run Code Online (Sandbox Code Playgroud)
<div>
<table class="table-blue">
<tr>
<td>one</td>
<td>one test</td>
</tr>
<tr>
<td>two</td>
<td>two test</td>
</tr>
<tr>
<td>three</td>
<td>three test</td>
</tr>
</table>
<table class="table-blue-fotter">
<tr>
<td>one</td>
<td>one test</td>
<td>one test</td>
</tr>
<tr>
<td>two</td>
<td>two test</td>
<td>one …Run Code Online (Sandbox Code Playgroud)