我正在试着打印一页。在该页中,我为表格指定了背景颜色。当我在chrome中查看打印预览时,它不会显示背景颜色属性...
所以我尝试了这个属性:
-webkit-print-color-adjust: exact;
但它仍然没有显示出颜色。
.vendorListHeading {
background-color: #1a4567;
color: white;
-webkit-print-color-adjust: exact;
}
<div class="bs-docs-example" id="soTable" style="padding-top: 10px;">
<table class="table" style="margin-bottom: 0px;">
<thead>
<tr class="vendorListHeading" style="">
<th>Date</th>
<th>PO Number</th>
<th>Term</th>
<th>Tax</th>
<th>Quote Number</th>
<th>Status</th>
<th>Account Mgr</th>
<th>Shipping Method</th>
<th>Shipping Account</th>
<th style="width: 184px;">QA</th>
<th id="referenceSO">Reference</th>
<th id="referenceSO" style="width: 146px;">End-User Name</th>
<th id="referenceSO" style="width: 118px;">End-User's PO</th>
<th id="referenceSO" style="width: 148px;">Tracking Number</th>
</tr>
</thead>
<tbody>
<tr class="">
<td>22</td>
<td>20130000</td>
<td>Jim B.</td>
<td>22</td>
<td>510 xxx yyyy</td>
<td>zznn@abc.co</td>
<td>PDF</td>
<td>12/23/2012</td>
<td>Approved</td>
<td>PDF</td>
<td id="referenceSO">12/23/2012</td>
<td id="referenceSO">Approved</td>
</tr>
</tbody>
</table>
</div>
发布于 2017-09-28 05:28:48
如果关闭了背景图形设置,则在打印时,Chrome将不会呈现背景色或其他几种样式。
这与css、@media或特异性无关。你可能可以绕过它,但是让chrome显示背景颜色和其他图形的最简单的方法是在More Settings下正确地选中这个复选框。
发布于 2015-02-20 00:59:19
我只需要在background-color标签上添加!important
属性就可以了,不需要webkit部分:
background-color: #f5f5f5 !important;
发布于 2015-08-07 06:02:53
您的CSS必须如下所示:
@media print {
body {
-webkit-print-color-adjust: exact;
}
}
.vendorListHeading th {
background-color: #1a4567 !important;
color: white !important;
}
https://stackoverflow.com/questions/14987496
复制相似问题