如何在打印机上打印背景图像作为水印答案

【问题标题】：how to print background image on printer as watermark如何在打印机上打印背景图像作为水印
【发布时间】：2011-02-23 20:18:16
【问题描述】：

我有一张表格的图片背景，语法如下

style="background-image(URL)"

问题是当我在打印机上打印时它没有打印。

你能告诉我如何得到这个

图像背景也可以作为水印打印在纸上。

我需要任何代码来不要求每个用户更改浏览设置。

谢谢

【问题讨论】：

标签： html image background watermark

【解决方案1】：

无论如何，用户可能不想在背景上浪费墨水。

我建议使用 z-index 为 0 的绝对定位 div 作为墙纸，使用 z-index 为 1 的绝对定位内容 div 作为内容。

为了缓解墨迹问题，您可以使用 css @media print 指令将背景的不透明度更改为 5% 到 10% 之间的某个值，使其更像是水印。

这是一个小提琴：http://jsfiddle.net/Xfxg3/

CSS：

@media print {
    #background{
    opacity:0.4;
    filter:alpha(opacity=40); /* For IE8 and earlier */
}
  }

#background{
    position:absolute;
    z-index:0;
    background:#255;
    display:block;
    min-height:100%; 
    min-width:100%;
}

#content{
    position:absolute;
    z-index:1;
}

HTML:

<div id="content">
    There is some content in here
</div>

【讨论】：

我注意到另一个答案已被标记为正确，尽管它没有回答问题。这是我的镜头。

【解决方案2】：

您可能已经从答案中注意到，默认情况下浏览器不打印背景图像。此外，没有办法强制所有访问者的浏览器打印水印。

强制打印水印的一种可能方法是创建一个位于内容下方的 div，其中包含水印的 IMG 标记的多次重复。这太笨拙了。

【讨论】：

【解决方案3】：

大多数浏览器都有打印背景的选项。在 FF 3.6.3 中，在文件 --> 页面设置 --> 打印背景（颜色和图像）下

【讨论】：

【解决方案4】：

这可以在浏览器中进行配置。当您打开打印选项时，有一个选项询问您是否打印背景图像。 :)

【讨论】：

OP 明确指出“我需要任何代码来不要求每个用户更改浏览器设置”。