In your ASPX page, put the following:
<input type="button" onclick="window.print();" value="Print" id="btnPrint" />
That creates a button that prints the webpage when you click it. Then, in your <head>
, add the following:
<link rel="stylesheet" href="print.css" type="text/css" media="print" />
That will apply the print.css
file only when printing. Create a file called print.css and add the following content:
body
{
background-image: url('watermark.jpg') no-repeat center;
}
#btnPrint
{
display: none;
}
Obviously, change watermark.jpg
to be the name of the file you want to use as a watermark in the background.
IN SUM: You have created a print button and have assured that when your webpage is printed, it will use watermark.jpg
as its background.
UPDATE:
As noted below, backgrounds do not print by default. The user would have to change their browser's print settings. So you should find a different way to show your watermark using text or an <img>
element. The above code still shows you how to apply CSS only when printing.