使用 window.print() 打印时背景颜色消失 [重复]

Posted 2023-03-06

【中文标题】使用 window.print() 打印时背景颜色消失 [重复]

【英文标题】：background color disappears when printing using window.print() [duplicate]

【发布时间】：2020-07-27 10:59:47

【问题描述】：

我正在尝试使用 window.print(); 在 angulat 中打印一个页面，一切正常，所有其他 css 工作正常，唯一的问题是可打印文档中没有显示背景颜色，我附上了StackBlitz 的例子，所以：有没有人遇到过这个问题？ ，如果是，有什么解决办法，谢谢。

StackBlitz Exemple from here

注意：我对***和其他论坛做了很多研究，没有人谈论这个问题。

可打印文件 HTML：

<div class="page-container">
<div class="title-container">Invoice Title</div>
<div class="body-container">
  This is what I'm going to print, everything works fine , but the background color never changes , no matter what i add to css file
</div>
</div>

页面的CSS：

.page-container
  width: 100%;
  background-color : rgb(216, 23, 23);  // as you can see , background not working 

.title-container
  font-size: 24px;
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  padding-bottom: 20px;
  border: 2px blueviolet solid;
  color: rgb(228, 0, 228);
  background-color : rgb(221, 0, 0) !important;// not working also

.body-container
  background : #000; // not working 

结果：

【问题讨论】：

您的打印机设置为节省墨水而不是打印背景。

***.com/search?q=print+background+color

@epascarello 谢谢你的回答，但我还是想拥有它

***.com/questions/14987496/…

【参考方案1】：

添加-webkit-print-color-adjust: exact;到css页面解决了chrom中的问题，color-adjust: exact;解决了mozilla firefox中的问题！