Browsers use a red background color, but when I se...">
Geek Answers Handbook

TDs background color not showing in preview

I have td:

<td align="left" bgcolor="#FF0000">

Browsers use a red background color, but when I see a print preview, there is no red color in the background. the font color is also white, but it also converts to white when previewing it.

Does anyone know what the reason is?

thanks

+7
html css browser printing
source share
4 answers

Printing background colors is supported differently by each browser, and by default it is often disabled. For example, in Safari , this is an option in the print dialog called "Print Backgrounds." I am not sure where this option is in other browsers.

+4
source share

For WebKit browsers (Safari, Google Chrome) to print a background image or color, you must add the following css style to the element:

 -webkit-print-color-adjust: exact;
+12
source share

I just ran into this question and consider that I have a solution. I initially did this with the H1 tag, but then used the same code for TD

 h1 { background-color:#404040; background-image:url("img/404040.png"); background-repeat:repeat; box-shadow: inset 0 0 0 1000px #404040; border:30px solid #404040; height:0; width:100%; color:#FFFFFF !important; margin:0 -20px; line-height:0px; }

Here are a few notes:

  • background-color - absolute rollback and mainly for posterity.
  • background-image uses a 1px x 1px # 404040 pixel made in PNG. If the user has images, they can work, if not ...
  • Set the window shadow if this does not work ...
  • Border = 1/2 the desired height and / or width of the window, solid, color. In the above example, I needed a field 60 pixels high.
  • Change the height / width depending on what you control in the border attribute.
  • The default font color will be black if you are not using! important
  • Set the height row to 0 to correct for a field that does not have a physical dimension.
  • Make and post your own damn PNG;)

See fiddle for a more detailed demonstration.

+3
source share

Try using CSS if you can, and if the background does not work with the print version, specify the css document to print. A.

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

The basic CSS is here:

td{ background-color:#FF0000; }

0
source share

More articles:


All Articles