HTML元素不会破坏元素值本身内的页面，从而导致多个半空页面

问题描述

我正在使用mark从markdown生成html，并使用可以通过npm安装的经过稍微修改的github-markdown-css版本。在html和css中，使用html-pdf生成pdf。

我定义了一个样式类，该类具有page-break-inside: avoid属性。我需要例如消息标题和消息本身，以使这两个项目不会被分页符分开。现在的问题是，由于这些页面之前已经中断，所以我在这些组之前有很大的空白区域，但实际上我只需要标题和消息之间的page-break-inside: avoid，而不是消息本身之内。

我如何尝试在消息本身中保留分页符？我已经尝试使用page-break-after: avoid作为标题，但是以某种方式没有做任何更改。

解决方法

我相信会

page-break-after: avoid;

针对消息上方的小标题/标题（示例）：

<h style="page-break-after: avoid;">MESSAGE TITLE</h>
<p>My Message</p>

根据您的说法，似乎您的div有一个拥抱元素（page-break-inside:avoid）。尝试使用<p>和<h>

将其分成较小的元素page-break-before:avoid和page-break-after:avoid