我试图为我们的应用程序制作一个可打印的样式表，但我在@media打印的背景颜色有问题。
@media print {
#header{display:none;}
#adwrapper{display:none;}
td {
border-bottom: solid;
border-right: solid;
background-color: #c0c0c0;
}
}
其他一切工作，我可以修改边界和这样，但背景色不会通过打印。我知道，如果没有更多细节，你们可能无法回答我的问题。我只是好奇是否有人有这个问题，或类似的，以前。
当前回答
明白了:
CSS:
box-shadow: inset 0 0 0 1000px gold;
适用于所有盒子——包括表格单元格!!
(如果pdf打印机的输出文件是可信的…?) 只在Ubuntu上的Chrome + Firefox中测试…
其他回答
* {
-webkit-print-color-adjust: exact;
}
此外，启用>模拟CSS媒体从>检查>更多的工具>渲染。非常详细的步骤可以在这里找到。
身体{ background - color: # E5FFE5; ｝ .bg_print { border-bottom: 30px solid #FFCC33; ｝ .orange_bg_print_content { margin-top: -25 px; 填充:0 10px; ｝ < div class = " bg_print”> < / div > < div class = " orange_bg_print_content”> 我的内容与背景! < / div >
测试和工作在Chrome和Firefox和Edge…
对于chrome，我已经使用了这样的东西，它为我工作。
在body标签中，
<body style="-webkit-print-color-adjust: exact;"> </body>
或者对于一个特定的元素，假设你有一个表格你想要填充一个td，也就是一个单元格，
<table><tr><td style="-webkit-print-color-adjust: exact;"></tr></table>
在某些情况下(没有任何内容，但有背景的块)，可以使用边框单独覆盖每个块。
例如:
.colored {
background: #000;
border: 1px solid #ccc;
width: 8px;
height: 8px;
}
@media print {
.colored div {
border: 4px solid #000;
width: 0;
height: 0;
}
}
tr.group-title {
padding-top: .5rem;
border-top: 2rem solid lightgray;
}
tr.group-title > td h5 {
margin-top: -1.9rem;
}
<tbody>
<tr class="group-title">
<td colspan="6">
<h5 align="center">{{ group.title }}</h5>
</td>
</tr>
工作在Chrome和边缘
