使用 CSS 样式将当前页面保存为 PDF

Posted 2023-05-07

【中文标题】使用 CSS 样式将当前页面保存为 PDF

【英文标题】：Saving current page as PDF with CSS styling

【发布时间】：2017-03-24 09:44:26

【问题描述】：

我有这个简单的代码可以保存我当前的页面（基于我希望保存的 ID），但是当它打开保存窗口时，我将其视为没有样式的纯 html 代码。有没有办法保存 PDF，包括 CSS 中的所有样式？

<script>

function printDiv(divName) 

 var printContents = document.getElementById(divName).innerHTML;
 w=window.open();
 w.document.write(printContents);
 w.print();
 w.close();

</script>

【问题讨论】：

你见过this library吗？

看这个问题：***.com/questions/17820857/…

当我将媒体类型添加到我的样式表时，由于某种原因它仍然会忽略它。我确实尝试过使用内联 HTML 内联样式，但它确实看到了！不知道问题出在哪里

您可能想要使用@media print 媒体查询。 joshuawinn.com/css-print-media-query

【参考方案1】：

function printDiv(divName) 
var printContents = document.getElementById(divName).innerHTML;
w=window.open();
w.document.write('<style type="text/css"> /* your code here */ </style>' + printContents);
w.print();
w.close();