How to print a div with style support?
I want print div content with style(separ开发者_如何学JAVAate .css file). I tried much but unable to print with style support.
Please help me!
You can call a function on clicking of "PRINT" button. and the function contain the div you want to print.Here in my example i want to print the content of div with id "main"
function CallPrint() {
var prtContent = document.getElementById('main');
var WinPrint = window.open('', '', 'width=800,height=650,scrollbars=1,menuBar=1');
var str = '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns=\"http://www.w3.org/1999/xhtml\"><head><style type=\"text/css\">.margin_0px table{*float:left} <\/style> <title>PRINT</title> <script type=\"text/javascript\">function abc() {} <link href=\"/css/internal111.css\" rel=\"stylesheet\" type=\"text/css\"/></head><body onload="abc();"><div class=\"maintable_big\">' + prtContent.innerHTML</div></div></body></html>';
WinPrint.document.write(str);
WinPrint.document.close();
WinPrint.focus();
}
Maybe this is what you're after?
<link href="stylesheetFileForPrintingOnly.css" rel="stylesheet" type="text/css" media="print">
You can read more about the media attribute here: https://developer.mozilla.org/en/HTML/Element/link
and here: http://reference.sitepoint.com/html/link/media
Use @media print in your css file, I'd say. Here's a comprehensive article on the subject.
精彩评论