有谁知道如何在8.5x11纸的页面中间对齐可打印内容?这是我的div
<div id = "printable">
<table>
//my table content
</table>
</div>
我尝试使用此CSS
@media print {
#printable{
position:absolute;
width:300px;
height:300px;
z-index:15;
top:50%;
left:50%;
margin:-150px 0 0 -150px;
}
}
但是点击我的打印按钮会做这个jQuery的事情
var restorepage = document.body.innerHTML;
var printcontent = document.getElementById('printable').innerHTML;
document.body.innerHTML = printcontent;
window.print();
document.body.innerHTML = restorepage;
location.reload();
使用此jQuery将在后台替换整个页面内容
打印以恢复以前的内容后,这就是为什么将div居中不起作用的原因TYIA帮助我
最佳答案
请在下面找到仅将内容居中打印的示例
var restorepage = document.body.innerHTML;
var printcontent = document.getElementById('printable').innerHTML;
document.body.innerHTML = printcontent;
window.print();
document.body.innerHTML = restorepage;
//location.reload();
@media print {
#printable{
display:flex;
justify-content:center;
align-items:center;
height:100%;
}
html, body{
height:100%;
width:100%;
}
}
<div id = "printable">
<table border="1">
<tr>
<td>John</td>
<td>Doe</td>
</tr>
<tr>
<td>Jane</td>
<td>Doe</td>
</tr>
</table>
</div>