Div 打印时文本的颜色发生变化

Question

我有一个 div，文本颜色为白色。

使用 css 媒体查询。

@media print {
     .myid_print_duo_name
     {
         z-index: 2;
         position: absolute;
         left: 0px;
         top: 330px;    
         width: 303px;
         height: 28px;
         line-height: 28px;     
         text-align: center;    
         color: white !important; 
         font-weight: bold;
         font-size: 20px;
         font-family: "Times New Roman";     
     }

 }

我的文字在打印预览中看起来有点暗。

我觉得还行，结果打印出来的效果和我的打印预览一模一样。为什么颜色变深了一点？

Answer 1

MDN Docs：添加以下规则将覆盖用户的打印机属性设置。

@media print {
  .myid_print_duo_name { /* Replace class_name with * to target all elements */
    -webkit-print-color-adjust: exact;
            color-adjust: exact; /* Non-Webkit Browsers */
  }
}

Answer 2

试试这个css，它可能对你有帮助。

@media print {
     .myid_print_duo_name{ -webkit-print-color-adjust: exact; color:#fff !important;}
}

Answer 3

有些浏览器有一个名为 print-color-adjust 的属性，它可能会使某些颜色变暗而使其他颜色变亮。尝试将这些添加到您的 CSS:

-webkit-print-color-adjust: exact;
        print-color-adjust: exact;

摘自 Smashing 的网站：http://www.smashingmagazine.com/2013/03/08/tips-and-tricks-for-print-style-sheets/

Div 打印时文本的颜色发生变化

Div Text's Color Changes when Printed

html

css

media-queries

media