css - 打印网页时显示图像

Question

我正在使用媒体打印来控制我的网页的打印，我不想在网页中显示图像，但是当用户想要打印时，我想显示这些图像。我写了下面的代码，但它不工作
在外部 CSS 中:

@media print { 
  img {
     display: block; 
  }
}

Answer 1

如果 img 的内联样式是 display:none; 它不会在 @media print 中被覆盖!important 标签。

您可以删除 display:none 的内联样式或进行打印查询:

@media print { 
  img {
     display: block !important; 
  }
}

此外，这是一个使用 div 背景颜色的示例，显示哪些方式将被覆盖，哪些方式不会。 <强> JSFiddle