语法不会失效，但视觉上常“没反应”，主因是打印样式被高权重屏幕样式覆盖、未启用浏览器“背景图形”选项、或框架（如Bootstrap）的默认@media print重置清除了自定义规则。
直接用
不会语法失效，但大概率视觉上“没反应”——因为浏览器只在触发打印时才解析它，且不自动覆盖已有高权重样式。你写了 ，但如果主样式里有 body { color: blue !important; }，打印时还是蓝色。
关键不是标签对不对，而是规则是否真正生效：必须显式提高选择器权重、禁用冲突的 !important、并绕过框架默认重置（比如 Bootstrap 的 @media print 块会清掉你的字体设置）。
@media print 里必须写的几条硬性规则
别只写 .nav { display: none; } 就交差。以下规则在真实打印中高频出问题，漏一条就可能白忙：
-
body { -webkit-print-color-adjust: exact !important; color-adjust: exact !important; }—— 否则 Chrome/Edge 默认跳过背景色和边框 -
a:link, a:visited { color: #000 !important; text-decoration: none; }+a::after { content: " (" attr(href) ")"; font-size: 9pt; color: #666; }—— 否则链接变灰块，URL 完全丢失 -
img { max-width: 100% !important; height: auto !important; }—— 高 DPI 图片不加限制会撑破 A4 宽度（210mm） -
* { margin: 0; padding: 0; box-sizing: border-box; }—— 框架或重置 CSS 留下的默认边距在打印时会被放大
为什么 Chrome 打印预览看着正常，实际 Ctrl+P 却没背景色？
因为「背景图形」开关被关了——这不是代码问题，是用户级设置。Chrome 和 Edge 默认关闭该选项，哪怕你写了 background: #fff 和 print-color-adjust: exact，也会被无视。
调试时别只信 DevTools 的 “Emulate CSS media → print”，它不模拟这个开关。必须手动点开打印对话框 → 「更多设置」→ 勾选 Background graphics。你无法用 JS 控制它，所以更稳妥的做法是：把所有关键信息从背景移到前景（比如用 border-left: 4px solid #007bff 替代浅蓝背景条）。
page-break-inside: avoid 在表格上不管用怎么办？
直接写在 有效做法是： 最易被忽略的一点：别只看打印预览，一定要导出为 PDF 实际翻页检查——预览器会“平滑”断裂效果，而真实打印机或 PDF 渲染器不会。 上基本无效。旧版 Safari、部分 Electron 内核、甚至某些 Chrome 版本对表格分页支持极差。
...
.print-table { break-inside: avoid; }
加
display: table-header-group; —— 这是唯一能让表头在每页重复的可靠方式width: 100% 和 max-width: 210mm，打印引擎计算宽度时容易溢出导致强制断页
