HTML/CSS - 打印样式,背景不会显示?

问题描述:

我在制作网站时遇到了一些麻烦,与在浏览器中查看它完全相同,无法打印。它看起来不错,唯一让我陷入困境的是它拒绝显示背景。图像很好,但它只是背景。我还没有尝试设置图像作为背景,但这不应该是必要的,对吧?HTML/CSS - 打印样式,背景不会显示?

我将背景应用于DIV元素,使用十六进制颜色(如果有的话)。

有没有办法解决这个问题?我搜索了它,但我没有发现任何人有同样的问题。

谢谢!

+1

某些浏览器在打印时可能会忽略背景,以节省墨水。 – You 2010-10-21 17:29:52

正在打印或不打印的背景图像不是您可以通过CSS强制的:它是浏览器的设置,大多数(如果不是全部)浏览器默认为'而不是'。

+0

嗯,没关系。有什么解决方法吗?我没有设置图像作为背景,我只是设置了一个纯色,但我不认为这很重要。 – Nike 2010-10-21 17:39:46

+0

我认为没有(除非您很好地邀请您的访问者更改其浏览器设置)。作为一个非常普遍的规则,背景材料应该用于装饰元素等。如果您的背景包含信息内容,您可以将其制作为图像(我的意思是一个IMG元素) - 这将被打印 - 并在必要时用许多“图像替换”技术之一隐藏文本内容。 – djn 2010-10-21 20:32:43

您可以尝试使用两个单独的元素(例如段落和图像),然后将图像的z索引设置为低于段落的z索引,然后将图像完全放置在内容后面。但我会建议不要打印背景。否则,你会搞乱用户的期望,人们可能会感到恼火。

+0

我可能会给你一个镜头。我没有为整个页面设置背景,我只是将它设置为表格标题。我不认为他们会因此而感到恼火。 :) – Nike 2010-10-21 18:01:31

+0

良好的通话。实际上,在桌面标题上显示背景很有意义......嗯......我必须做一些头脑风暴,看看我能否想出一个更有效的方法来做到这一点。另一个想法是,您可以在包含所需文本和背景的表格标题中使用图像。只要确保你使用正确的替代文字,如果你使用这种方法。 – 2010-10-21 21:21:12

+0

许多浏览器的好处是,如果您在黑色背景上有白色文本,例如,当您在没有背景的情况下打印时,浏览器会将您的文本颜色更改为黑色。 – 2010-10-26 18:04:11

默认情况下,许多浏览器不打印背景图像和颜色。您需要在打印选项中启用该功能。 Chrome并没有这样的选择,但做一个WebKit的浏览器(Safari浏览器,谷歌浏览器)打印背景图像或颜色,你应该在以下CSS样式添加到该元素:

-webkit-print-color-adjust: exact; 
+0

这适用于我们内部支持的浏览器列表。*尊重。 – RSG 2013-07-24 18:39:28

CSS:box-shadow: inset 0 0 0 1000px gold;

厂适用于所有浏览器和表格单元格和行。

+0

这与所问的问题有什么关系?他们询问有关未打印的背景图像。 box-shadow如何以任何方式与*相关*? – 2013-10-08 07:19:54

+0

@Andrew,这个技巧非常完美:盒子的阴影变成背景,然后它被打印出来! – Guillaume 2014-01-13 15:43:16

+0

嗯,@Guillaume;我现在明白了。编辑过的额外说明也有帮助。感谢您纠正我! – 2014-01-13 15:48:30