html - 打印纸上不显示表格背景图像

Question

模板.html

{% block css-custom %}
    <link rel="stylesheet"  type="text/css" media="print" href="{{ STATIC_URL }}style/print.css" />
    <link rel="stylesheet"  type="text/css" media="screen" href="{{ STATIC_URL }}style/print.css" />
{% endblock %}

{% block main-content %}
''''''''''''''
<table width="100%" border="0" class="printimg">

            <tr><td>some data</td></tr></table>
'''''''''''''''''
{% endblock %}

我想将上面的图像设置为表格的背景。如果我在 中的标记中设置相同的图像，它将用于显示，但作为背景它没有发生。作为 html 页面它正在工作，问题是打印在纸上。

在打印预览时背景图像即将显示，但在纸上打印时图像消失了。

编辑:

报告.css

.printimg {
           background:url('/static/images/human.png');
           width:128px;
           height:293px;
           background-position:center;"
          }

/* media:screen */
@media screen {
.printimg img{
    visibility: hidden;
}
}

/* media:print */
@media print {
.printimg img{
    visibility: visible;
}
}

我试过这个css，他们的问题还是一样。

Answer 1

1.要在 Chrome 和 Safari 网络浏览器中启用后台打印，请添加

-webkit-print-color-adjust:exact;

在你的 print.css 文件中，其他都是一样的

2.在 FireFox 中，默认情况下 “打印背景颜色和图像” 在其打印设置中关闭，没有 CSS 会覆盖它。

如果需要背景图片，用户应手动开启。

在 FF 中打开背景的步骤:

Go to File -->Page setup -->Formats & Options -->Tick Print background(images & colors)

希望对您有所帮助!