css - 浏览器打印预览不显示 CSS 背景

Question

我的网站工作正常，但是当我点击文件 > 在浏览器上打印(它的浏览器打印预览)时，所有的 CSS 都乱七八糟，背景颜色被替换为空白，并且在预览时没有得到 Logo 页。

那么我如何创建用于打印预览的 CSS 文件以及当用户单击打印时我如何调用。

Answer 1

您需要针对出现此错误的原因提供标记。

信息:浏览器默认从不打印背景色，您需要在浏览器中启用该选项..

以防万一，如果你正在使用

<link rel="stylesheet" type="text/css" href="print.css" media="screen" />

然后将其替换为 media=screen, print 以便它将规则应用于您的网站以及打印..

<link rel="stylesheet" type="text/css" href="print.css" media="screen, print" />

您还可以像这样使用特定于打印的样式表:

<link rel="stylesheet" type="text/css" href="print.css" media="print" />

您还可以使用特定于打印的@media 查询

@media print {
 /* Whatever */
}

最后但并非最不重要的是在浏览器中启用打印:

Firefox:点击 alt(如果您的浏览器菜单栏被隐藏)- 文件 - 页面设置 - 勾选打印背景

Chrome:要在 Chrome 中启用打印，请使用此 CSS 属性 -webkit-print-color-adjust:exact;