@media print {
  body { font-family: 'Noto Sans SC', sans-serif; color: #000; }
  .no-print { display: none; }
}

客户把报价单打印成 PDF,标题全变成宋体,页面上用的思源黑体一点没生效,屏幕预览却完全正常。这类现象通常不是突然出现的,往前翻半天日志能看到苗头。

追下去是这么回事:打印走的是另一套媒体查询,@media print 里只改了字号和边距,字体族没重新声明,浏览器就用打印默认字体。

「打印字体缺失」排查到最后往往是很小的一处差异,前面那些复杂猜测可以先放一放。监控和日志的时间要对上,时区不一致会多绕很大一圈。

临时改动用注释写上日期和原因,过两周自己都记不清为什么这么写。动手前把原文件复制一份带时间戳,出问题立刻换回去,比现场分析快得多。

处理上按这个顺序:在 @media print 里明确写上 font-family 和屏幕保持一致;把颜色改成纯黑 去掉浅灰背景 打印机会把浅色打成空白;用浏览器打印预览逐页看 别只在屏幕上确认。

确认没问题再收工,打印预览里标题是黑体,导出的 PDF 和屏幕排版一致。

作者 9823189