将 CSS 添加到默认的 Google Chrome 打印答案

【问题标题】：Adding CSS to default Google Chrome printing将 CSS 添加到默认的 Google Chrome 打印
【发布时间】：2012-03-28 16:59:07
【问题描述】：

我正在使用 ( ctrl + P ) 打印我的 PHP 应用程序页面（默认打印）。我如何确保 CSS（表格、填充、单元格间距、带不透明度的背景图片）打印在工作表上。我正在从另一个文件调用 CSS。

感谢您的帮助和时间。

【问题讨论】：

默认情况下不打印背景图像，必须由用户切换。
请问“由用户切换”是什么意思？谢谢。
他的意思是在打印对话框中有一个复选框。您不能强制通过 CSS 打印背景图像。
Chrome（和 Safari）实际上没有打印背景图像或颜色的选项。这仅适用于 Firefox/IE。相比之下，Webkit 浏览器的打印输出确实缺乏。

标签： php html css google-chrome printing

【解决方案1】：

你必须添加这个

html{-webkit-print-color-adjust:exact;}

到项目的任何 css 文件，最好是打印文件，因为打印时其他文件不会加载。它将强制 chrome 完全按照编码使用每种背景颜色和图像。

【讨论】：

Chrome 的完美提示，谢谢！我终于可以在 Chrome 上打印那些斑马条纹的 jQuery 表格了。
这应该是公认的答案。它让生活变得更好

【解决方案2】：

将此添加到您的 HTML 页面。现在您需要手动调整页面，以使其适合打印页面。（使用 Chrome 中的预览功能）

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

浏览器有趣的部分是media=print

您可以在此处找到更多用于打印网页的样式命令：

【讨论】：

我正在从另一个文件中调用 CSS，而您提供的内容看起来像是 HTML 内容。
您需要指定“从另一个文件调用”的含义。在某些时候，必须将其添加为带有此类字符串的 HTML。
我的意思是 CSS 与 HTML 不是同一个页面，尽管我有一个调用标题的包含并且该标题包含链接标签。
听起来像是基于框架的。例如，在 symfony 1.x 中，您可以添加这样的样式表：echo stylesheet_tag('print', array('media' => 'print')); 我不知道您使用的是哪个或关于它的任何东西。 ---- “CSS ain't jesus” - 你让我发笑！ :)

【解决方案3】：

您需要包含一个打印样式表，如detailed by Dan Lee。然而，这只是答案的一半。另一半是Chrome（和Safari）的打印选项很差，无法打印background-images或background-colors。在尝试创建使用颜色来区分不同类型的日历条目的FullCalendar 的可打印版本时，我必须弄清楚这一切。

我附上这些打印说明：

Firefox 的打印输出最好，Internet Explorer 次之。

您可能希望在浏览器中打开“打印背景”选项：在 Firefox 或 Internet Explorer 中：转到文件 -> 页面设置 -> 检查打印背景（颜色和图像）

虽然 Chrome 和 Safari 可以使用，但它们没有打印背景选项。很难区分日历上的条目类型。

如果您的页面足够简单，您可以替换为实际的<img>s，并使用 CSS 拉伸并将它们定位在可能位于div 或td 中的任何文本后面。这对于我所做的 FullCalendar 项目是不可能的，但它在更简单的表上运行良好。它与 Chrome、Firefox 和 IE 兼容，并且不需要用户切换特定选项即可获得正确的输出。

这是从 Windows 上的 Chrome 17.0.963.83 和 Safari 5.1.4 开始的。

【讨论】：