html - css2pdf xepOnline Cloudformatter - Hide elements in html but display in PDF

Question

http://www.cloudformatter.com/CSS2Pdf.Demos.PrintMedia

There is an option in this cloudformatter called 'noprint' which can be applied to elements which display on the html page but aren't added to the PDF. What I want is the opposite. I want elements not to appear on the html page but appear in the PDF.

Does anyone have experience with this?

Thanks

Answer 1

对于我上面的评论，我为你创建了一个简单的小提琴。

有一个 .printme 类的块，通常设置为 display:none。然后在您的@media print CSS 规则中将该块设置为显示：块。我将@cloudformatter 中的示例保持不变，因此您可以看到它在 PDF 中隐藏了一个段落并显示了另一个段落。

虽然输入 HTML 看起来像这样：

正如您在原始 HTML 中的小提琴中看到的那样，显示了一个块，而另一个不是因为这个 CSS：

.printme { display:none;}
@media print {
  .noprint {display:none;}
  .printme {display:block;}
}

http://jsfiddle.net/p4gnomkn/1/

结果 PDF 显示隐藏了一个块，并且显示了隐藏的块。当然，这可以是一个任意大小的 div：