将CSS应用于printWindow.print();在Javascript中

Apply CSS to printWindow.print(); in Javascript

本文关键字:Javascript CSS 应用于 printWindow print      更新时间:2023-09-26

我在HTML页面中有一个部分需要打印。我使用以下JS方法打印它。

printWindow.print();

我就是这样做的。

$("#toprint").on("click", function () {
            var divContents = $("#tobebilled").html();
            var printWindow = window.open('', '', 'height=400,width=800');
printWindow.document.write('<link rel="stylesheet" type="text/css" href="style/print.css"/>'); 
            printWindow.document.write('<html><head><title>Print Bill</title>');
            printWindow.document.write('</head><body >');
            printWindow.document.write(divContents);
            printWindow.document.write('</body></html>');
            printWindow.document.close();
            printWindow.print();

问题是我使用了3个css文件

Custom.min.css
bootstrap.min.css
components.min.css

在我的印刷品中,我似乎不可能应用这些风格。印刷品是粗制滥造的。如何应用CSS?

printWindow.document.write('<link rel="stylesheet" type="text/css" href="style/print.css"/>')

这包括打印.css.

对其他具有正确路径的css文件执行相同的操作