@media print {
* { box-shadow: none !important; text-shadow: none !important; }
.card { border: 1px solid #ccc; }
}
屏幕上轻薄的卡片投影,打印后变成一片灰雾,一张 A4 纸的墨量明显偏多,文字边缘也发虚。先别急着动参数,把报错原文和时间点记下来,顺序反了容易白折腾。
原因不复杂,box-shadow 在打印时会被栅格化成灰色底纹,部分驱动还会把它当成背景图输出。投影越重,耗墨越明显。
「打印阴影耗墨」确认了原因之后,改动尽量只碰那一处,顺手改的东西后面最容易出问题。改完隔一天再看一次,当场正常不代表能稳住。
测试环境和线上的差别,往往就在版本号和那几行被忽略的配置上。线上出问题先对时间点,跟发布、备份、任务执行的时刻排一排,能省掉一半功夫。
日志级别临时调高可以,记得改回去,长期开着既占磁盘又掩盖真问题。
处理上按这个顺序:打印样式里统一清掉 box-shadow 和 text-shadow;需要层次的地方改用 1px 实线边框;打印预览放大到 200% 检查文字边缘是否干净。
改完只确认一件事:打印稿上不再有灰雾,卡片靠细边框分层,文字边缘清晰。
