window.print() 在将 html 转换为 pdf 时不应用 css

Question

我在从 html 打印 pdf 时遇到问题，我正在使用 window.print() 函数但它没有应用 CSS，请有人帮我解决这个问题

这是我的代码，在这里我在第 3 行和第 4 行包含 CSS 文件，但这不起作用

CSS 在两到三个文件中，它是外部 css 而非内联，我尝试在这些文件中添加 @media 打印但没有用，让我知道我是否在下面的代码中正确引用了这些 css 文件，它是 reactjs 应用程序

let mywindow = window.open('', 'PRINT', 'height=650,width=900,top=100,left=150');

mywindow.document.write(`<html><head><title>test</title>`);
mywindow.document.write( `<link rel="stylesheet" href="style.css" type="text/css" media="print"/>` );
mywindow.document.write( `<link rel="stylesheet" href="App.css" type="text/css" media="print"/>` );
mywindow.document.write(`</head><body>`);

mywindow.document.write(document.getElementById("owtab").innerHTML);
mywindow.document.write(`</body></html>`);

mywindow.document.close();
mywindow.focus();

mywindow.print();
mywindow.close();

Answer 1

您需要使用媒体查询进行print ，以便在打印时提供 css。 检查此链接。

您可以按如下方式使用：

@media print {
    /* styles here */
}

window.print() 在将 html 转换为 pdf 时不应用 css

问题描述

1 个解决方案

解决方案1
0 2021-07-30 06:18:30

window.print() 在将 html 转换为 pdf 时不应用 css

问题描述

1 个解决方案

解决方案1 0 2021-07-30 06:18:30

解决方案1
0 2021-07-30 06:18:30