一、了解CSS page-break-before
CSS page-break-before属性定义在当前元素之前是否添加分页符，常用于打印排版的网页中。该属性值可以是auto（默认值，即浏览器根据情况自动添加分页符）、always（总是添加分页符）或者avoid（尽量不添加分页符）。该属性仅在打印时有效果，在屏幕上无效。
/* 默认值 */
page-break-before: auto;
/* 总是添加分页符 */
page-break-before: always;
/* 尽量避免添加分页符 */
page-break-before: avoid;
二、应用CSS page-break-before
常见的应用场景是打印排版，如希望当某些元素跨页时，尽量不要将其分在两个页面，可以使用page-break-before: avoid;。同时在某些情况下，如需要在表格的每个重复标题之前打印表格头，可以使用page-break-before: always;。
为了更好地展现该属性的应用效果，我们可以使用以下代码（对于打印预览页面效果更佳）：
.box {
background-color: #eee;
height: 200px;
page-break-before: always;
}
.text {
margin-top: 30px;
height: 200px;
page-break-before: avoid;
}
Box
原创文章，作者：小蓝，如若转载，请注明出处：https://www.506064.com/n/304091.html
微信扫一扫 
支付宝扫一扫 