假设每条消息将占用打印页面的 3/4。如何避免将第二条消息分成两页?如果可能的话,我希望将消息保留在一页上。 如果消息要中断,它应该从新页面开始。
<div class="paperSheet">
<div class="paperSheet__message">
<p> Title </p>
<p> Text </p>
</div>
<div class="paperSheet__message">
<p> Title </p>
<p> Text </p>
</div>
</div>
到目前为止,我只设置了 paperSheet 在打印时可见。
@media print {
body * {
visibility: hidden;
}
#paperSheet, #paperSheet * {
visibility: visible;
}
#paperSheet{
position: absolute;
left: 0;
top: 0;
border: none;
box-shadow: none;
width: 100%;
}
}
最佳答案
试试 page-break-after
属性。这应该在每个元素之后强制分页。例如:
#paperSheet{
position: absolute;
left: 0;
top: 0;
border: none;
box-shadow: none;
width: 100%;
page-break-after:always;
}
关于html - 如何将 div 与 child 保持在同一打印页面上?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58859223/