24

我想使用div具有 a 的 a background-color,但如果我打印页面,它会显示为白色 。

当我使用它创建表<tr bgcolor="#333333">时也不起作用。

如何使用cssand创建打印页面html

我的代码:

<table border="0px" cellspacing="1" cellpadding="0" bgcolor="#777777" width="650px">
   <tr bgcolor="#999999">
       <td align=right colspan=2><span style="font:bold 14px 'b nazanin';">Text</span></td>
   </tr>
</table>
4

6 回答 6

26

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

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

于 2013-10-03T04:32:29.947 回答
24

我会研究将样式表定位到打印的媒体查询方式。我不相信你会找到一种通用的跨浏览器来做你想做的事情(控制用户的打印机是否打印背景)而不使用你的内容的 PDF,这可能是不可取的/不可行的。但是,您应该考虑特别处理您的打印样式,并且可能在打印页面的设计中避免使用背景。

http://www.w3.org/TR/css3-mediaqueries/

编辑

看到您的其他评论,如果您必须打印背景并且只有一个用户,请教您的用户让打印机打印背景。例如在 Firefox 中查看(复选框):

打印背景对话框 Firefox

于 2011-07-01T21:50:34.843 回答
18

默认情况下不打印背景颜色和图像。

这是您的用户可以更改的打印机选项,但您绝对不能指望您的用户知道或这样做。您无法从网络端控制它(据我所知)。

于 2011-07-01T21:38:14.137 回答
17

在 Crome 中“-webkit-print-color-adjust:exact;” 为我工作。

采用:

@media print {
    .collage_bg {
        background-color: #E6E7E9 !important;
        -webkit-print-color-adjust: exact; 
    }
}

或检查背景图形选项: 在此处输入图像描述

这两种选择对我来说都很好。

于 2016-07-23T16:08:09.063 回答
2

当我使用固定大小的块元素时,这对我有用。使用的图像是 1px X 1px 但被强制扩展为框的大小。这样我们直接打印图像而不是背景颜色/图像。

<style type="text/css">
.outer {
    width: 200px;
    height: 80px;
    position: relative;
}
.outer .grayBg {
    position: absolute;
    left: 0;
    top: 0;
    height: 80px;
    width: 100%;
    z-index: 1
}
.inner {
    width: 100%;
    position: relative;
    z-index: 10
}
</style>


<div class="outer"><img src="grayBg.png" class="grayBg" />
  <div class="inner">Some text</div>
</div>
于 2013-01-09T15:13:55.920 回答
0

但是,您始终可以为此使用图像。制作一个宽度为 1px 的图像并像这样重复它:

background: url('path/to/image.png') repeat-x;
于 2012-07-17T13:50:27.610 回答