Chrome CSS滤镜灰度扭曲图像/文字

Question

情况很简单：

我在页面上有内容，我想在打印时对它进行灰度处理。我发现做到这一点的方法是使用CSS滤镜

.body { 
    filter: Gray(); 
    filter: url('#grayscale'); 
    -webkit-filter: grayscale(1); 
    filter: grayscale(100%); 
} 

一切都显示在网站上不错，但扭曲了，当我尝试打印。

Check out the fiddle here（按Ctrl-P，并期待在第2页的例子。）

有没有人见过这个？我正在使用谷歌浏览器v60.0.3112.113

Answer 1

我一直在努力解决您的问题，我想出了一个小的文本解决方案，但无法修复图像。

我发现这非常适用于文：

body { 
    color: red; 
} 
@media print { 
body { 
    color: #000 !important; 
    } 
} 

我希望它有助于一点点反正...我做的文本显示为红色只是为了证明它改变打印模式下的颜色。文字看起来很脆，但形象仍然是一个问题。抱歉。