从 Chrome 打印 - 未正确处理黑白相间答案

【问题标题】：Printing from Chrome - not dealing with white-on-black correctly从 Chrome 打印 - 未正确处理黑白相间
【发布时间】：2019-09-06 10:28:41
【问题描述】：

我有一些 html，我正在尝试使用 puppeteer 将其转换为 pdf，并且 html 有一些黑色背景和顶部白色文本的部分。当我使用 puppeteer 将其转换为 pdf 时，它会将黑色文本完美呈现为白色，但黑色文本的位会变为灰色文本的白色背景。

这是一些示例 html：

<!DOCTYPE html>
<html>
<head>
</head>
<body style="font-family:Arial;">

<div style="display: flex; max-width: 100mm;">
    <div style="padding: 1em;">
        <h1>A</h1>
    </div>
    <div style="background:black;color:white;padding: 1em;">
        <h1>C</h1>
    </div>
</div>



</body>
</html>

当我在自己的 Chrome 浏览器中尝试并按 ctrl+p 进行打印时，它实际上做了同样的事情 - 它将黑底白字渲染为白底灰字。

这里发生了什么？我该如何解决这个问题？

【问题讨论】：

我尝试遵循in this question 的建议，但它并没有解决我的问题，无论@media print 样式如何，它都会继续以相同的方式打印
您需要编程解决方案还是只需要 PDF？ Chrome 允许根据您的打印样式将整个网页保存为 PDF。然后你可以打印没有第三方库的 PDF。
是的，这就是我已经在做的事情。我将进入 Chrome 并以 PDF 格式打印，但它并没有保持我的风格。它通过 puppeteer 在我的 Windows PC 和 Linux 服务器环境中执行此操作。

标签： css google-chrome printing

【解决方案1】：

经过一番折腾，我找到了答案。

打印到pdf时，可以点击“更多设置”，有一个设置叫做“背景图形”。这正确显示了我的黑白部分。

此外，我正在使用来自 php / Browsershot 上下文的 puppeteer。 Browsershot命令做'背景图形'是函数$browsershot->showBackground()

【讨论】：

这适用于任何人想要直接从浏览器下载笔记本的情况。更好的格式和文本。