如何使用css属性打印pdf页面？答案

【问题标题】：How to print pdf page with css property?如何使用css属性打印pdf页面？
【发布时间】：2021-10-12 16:28:44
【问题描述】：

function printDiv() {
   var divContents = document.getElementById("box2text").innerHTML;
   var a = window.open('', '', 'height=500, width=500');
   a.document.write('<html>');
   a.document.write('<body > <h1>Div contents are <br>');
   a.document.write(divContents);
   a.document.write('</body></html>');
   a.document.close();
   a.print();
}

这是我正在使用的 html 代码

 <div class="box2" id="box2">
    <textarea name="box2text" id="box2text" cols="30" rows="10"></textarea>
 </div>
 <div class="button">
    <button onclick="printDiv()">PRINT</button>
 </div>

这个只打印文本，我想要带有 css 属性的文本，比如颜色

【问题讨论】：

考虑编辑问题而不是将代码转储到评论中
现在我换了先生。
你需要一些印刷媒体 css

标签： javascript html css pdf dom

【解决方案1】：

您可以创建一个空白的 html 页面 (print-page.html)，将您的 css 链接到它。并使用以下代码打开它并将您的内容插入其中，然后打印内容：

function printDiv() {
    var divContents = document.getElementById("box2text").innerHTML;
    const printWindow = window.open('print-page.html', '_blank', `width=${window.innerWidth},height=${window.innerHeight}`);
    printWindow.onload = function(){
        printWindow.document.body.innerHTML = divContents;
        printWindow.print();
    }
}

【讨论】：

如果我想用格子纸代替空白纸使用javascript打印pdf，程序是什么？
@YUVRAJJWALA 我认为没有简单的方法。但同样，您可以使用 CSS 将您的内容设置为直纹纸，然后打印出来。这是我为你找到的一篇 codepen 文章：codepen.io/ceg9498/post/creating-lined-paper