Question

我在Windows上的Chrome浏览器中遇到问题（尝试过IE11，FF，Opera，Safari）并打印出来。只有在使用系统打印对话框时才会出现此问题。使用Chrome打印预览会呈现预期结果，但只是在使用系统打印对话框时才会出现问题。

下面的第一张图片是预期的结果（使用普通的Chrome打印预览窗口打印）： Expected printout result

这是我得到的（使用系统打印对话框）： Actual result

我认为这个问题非常自我解释 - 所有文字都有白色突出显示。

另一个可能相关的问题是我的字体都不正确 - PDF是使用Arial渲染的，而不是我声明的正确字体。

这些打印到PDF打印机，但是在纸上打印时结果完全相同，我尝试过两种不同的打印机制造商。

我会发布CSS（因为我怀疑这是问题），但我不确定要发布什么。

我尝试过改变不同CSS值的各种元素（太多而不是名字），但我尝试了很明显的：背景颜色和背景，尝试去除不透明等等。

任何想法都将不胜感激！

修改：带有示例的实时网址位于：iNewsletter

编辑：刚写了一个简单的测试用例也失败了：

<!DOCTYPE html>
<html>
    <head>
        <style>
            #bg {width: 500px; height: 500px;}
            #text {margin-top: -500px;}
        </style>
    </head>
    <body>
        <div id="bg"><img src="http://inws-cache-dev.s3.amazonaws.com/3-resize-1024-768.jpg" width="500" height="500" /></div>
        <div id="text">This text will have a white highlight</div>
    </body>
</html>

这让我觉得这是一个Chrome错误

Answer 1

问题在于你的CSS，就像你猜到的那样。在CSS中搜索@media print，它控制打印样式。您提供的实际网站不允许任何打印，因此您可以获得完全白色的文档，因为它设置了打印样式显示：无。

Chrome系统打印对话框文字白色突出显示

1 个答案: