在 Chrome 中打印网页的自定义 Css 版本

Question

使用 Google Chrome 的检查器，我可以轻松检查网页（任何 public 网页，不是我控制的网页）将如何呈现以打印，doing this.

此外，I can change 一些 Css 样式的外观正在运行。

我的问题是：我真的可以打印我正在浏览的网页的修改版本吗？默认情况下不是，我已经检查过了，但也许我可以做些什么...

（编辑：我对改变背景颜色特别感兴趣）

Answer 1

我只是在更改背景颜色，所以我不自觉地认为印刷版忽略了我的 'on the fly' 更改。事实上，Chrome 和 Safari 中的打印版本总是忽略背景颜色，无论它们是原始版本还是修改版本。

最终的解决方案是动态编辑HTML，然后将-webkit-print-color-adjust: exact !important;添加到要打印背景颜色的元素。

在我的例子中，我将其添加到 <head> 元素：

<style>
.elements-i-want-to-change {
  background-color: [the colour];
  -webkit-print-color-adjust: exact;
}
</style>

现在，印刷版将在背景中包含我修改过的颜色:-D

Print a customised Css version of a webpage in Chrome