css page-break-after:避免;在<h1> </h1> <p> </p>模式下不起作用

我正在尝试将具有CSS样式表的markdown转换为pdf。我使用分页后:避免;用于我的标头,但不起作用。

要转换为pdf,请使用pandocwkhtmltopdf,例如:pandoc -t html --css mycss.css mymd.md -o mypdf.pdf --pdf-engine=wkhtmltopdf --pdf-engine-opt=--print-media-type

mycss.css文件为:

@media print {
    h1 {
        page-break-after: avoid;
        page-break-inside: avoid;
    }

    p {
        page-break-inside: avoid;
    }
}

body {
    font-size: 100%;
}

* {
    background-color: #ffffff;
    color: #222;
    text-align: justify;
    text-indent: 35px;
    font-family: 'Times New Roman',Times,serif;
}

h1 {
    color: #0047b3;
    font-size: 3em;
    font-family: Georgia,serif;
}

p {
    font-size: 2em;
}

mymd.md文件为:

Lorem ipsum dolor sit amet,consectetur adipiscing elit,sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident,sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet,sunt in culpa qui officia deserunt mollit anim id est laborum. 

# Should be page 2
Lorem ipsum dolor sit amet,sunt in culpa qui officia deserunt mollit anim id est laborum.

# Another title
Lorem ipsum dolor sit amet,sunt in culpa qui officia deserunt mollit anim id est laborum. 

它会在第1页而不是第2页中打印标题:

css page-break-after:避免;在<h1> </h1> <p> </p>模式下不起作用

这是怎么了?

如果我使用pandoc -t html --css mycss.css mymd.md -o myhtml.html生成HTML文件,则会得到:

<p>Lorem ipsum dolor sit amet,sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<h1 id="should-be-page-2">Should be page 2</h1>
<p>Lorem ipsum dolor sit amet,sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<h1 id="another-title">Another title</h1>
<p>Lorem ipsum dolor sit amet,sunt in culpa qui officia deserunt mollit anim id est laborum.</p>

谢谢您的帮助。

伊萨亚

gdeexx1999 回答:css page-break-after:避免;在<h1> </h1> <p> </p>模式下不起作用

暂时没有好的解决方案,如果你有好的解决方案,请发邮件至:iooj@foxmail.com
本文链接:https://www.f2er.com/2989236.html

大家都在问