css实现多div打印分页问题

您所在的位置:网站首页 div分页显示 css实现多div打印分页问题

css实现多div打印分页问题

2023-07-10 13:13| 来源: 网络整理| 查看: 265

要实现在打印时每个  都能单独展示在一页上,你可以使用CSS的@media print 媒体查询和page-break-after属性。

首先,你可以添加一个特殊的类名,用于表示需要在打印时分页的  元素。

然后,你可以使用CSS的@media print 媒体查询来设置打印样式,并使用page-break-after属性在每个需要分页的  后添加分页符。

@media print { .print-page { page-break-after: always; /* 添加分页符,在每个print-page div之后分页 */ } }

这样,在打印时,每个带有 .print-page 类名的  将会单独展示在一页上。

请注意,为了在预览打印页面时看到效果,你可以使用浏览器的打印预览功能。你可以通过按下 Ctrl + P(在Windows)或 Command + P(在Mac)来快速预览打印效果。

以下是一个完整的示例:

@media print { .print-page { page-break-after: always; /* 添加分页符,在每个print-page div之后分页 */ } }

使用上述代码,在打印时,每个带有 .print-page 类名的  将单独展示在一页上。



【本文地址】


今日新闻


推荐新闻


    CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3