在完整网页中打印出网页

Question

When i want to print my web page, It will do print complete web page. Is there any option to print off web page. Now i am working for Invoice Statements.

It print's all page like menu,logout,print,and other whatever in my web page that will print automatically. But i want to print only invoice details like company name, logo, address, invoice table, note, and signature.

Is it any then tell me how it is possible?

This code print full page

<script language="JavaScript"> 
if (window.print) {
 document.write('<form><input type=button name=print value="Print"     onClick="window.print()"></form>');
}
</script>

But i need to print invoice details only on that page.

Thanks.

Answer 1

Add an extra stylesheet to your page, and make use of the media element:

<link rel='stylesheet' media='screen,print' href='css/standardstylesheet.css'>

<!-- print stylesheet -->
<link rel='stylesheet' media='print' href='css/printStyles.css'>

In your print style sheet add selectors for elements you don't want to print, and set them to display:none :

#myMenu, #myNavBar, #someOtherElement {
    display:none;  /* Opacity:0; might work too. */
}

You might have to adjust the CSS to ensure that elements don't move around when your selected no-printing elements have disappeared.