从window.print（）中删除页眉和页脚
我正在使用window.print（）打印页面，但我得到的页眉和页脚包含页面标题，文件path，页码和date。 如何删除它们？
我也试过打印样式表。
#header, #nav, .noprint { display: none; } 请帮忙。 谢谢。
在Chrome中可以隐藏这个自动页眉/页脚使用
@page { margin: 0; }
由于内容将延伸到页面的限制，页面打印页眉/页脚将不存在。 当然，在这种情况下，应该在body元素中设置一些边距/填充，以便内容不会一直延伸到页面的边缘。 由于常见的打印机不能获得无边距打印，这可能不是你想要的，你应该使用这样的东西：
@media print { @page { margin: 0; } body { margin: 1.6cm; } }
正如Martin在评论中指出的那样，如果页面有一个滚动页面的长元素（如大表格），页边空白将被忽略，并且打印版本看起来很奇怪。
在这个答案的原始时间（2013年5月），它只在Chrome上工作，不知道现在，没有必要再试一次。 如果您需要支持无法浏览的浏览器，您可以即时创buildPDF并打印（可以创build一个自embeddedPDF的embedded式JavaScript），但这是一个巨大的麻烦。
Firefox：
- 在
<html>添加moznomarginboxes属性
例如：
<html moznomarginboxes mozdisallowselectionprint>
我相信添加这个代码在你的CSS文件将解决这个问题
<style type="text/css" media="print"> @page { size: auto; /* auto is the initial value */ margin: 0mm; /* this affects the margin in the printer settings */ } </style>
你可以访问这个了解更多关于这个
今天，我的同事偶然发现了同样的问题。
由于“margin：0”解决scheme适用于基于铬的浏览器，但是，即使@页边距设置为零， Internet Explorer也会继续打印页脚。
解决scheme（更多的是一个黑客）是在负面的利润率的页面。
@page {margin:0 -6cm} html {margin:0 6cm}
请注意，负边界不适用于Y轴，只适用于X轴
希望能帮助到你。
CSS标准启用一些高级格式。 在CSS中有一个@page指令，可以启用一些仅适用于分页媒体（如纸张）的格式。 见http://www.w3.org/TR/1998/REC-CSS2-19980512/page.html 。
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Print Test</title> <style type="text/css" media="print"> @page { size: auto; /* auto is the current printer page size */ margin: 0mm; /* this affects the margin in the printer settings */ } body { background-color:#FFFFFF; border: solid 1px black ; margin: 0px; /* the margin on the content before printing */ } </style> </head> <body> <div>Top line</div> <div>Line 2</div> </body> </html>
@media print { .footer, #non-printable { display: none !important; } #printable { display: block; } }
1. 对于Chrome和IE
<script language="javascript"> function printDiv(divName) { var printContents = document.getElementById(divName).innerHTML; var originalContents = document.body.innerHTML; document.getElementById('header').style.display = 'none'; document.getElementById('footer').style.display = 'none'; document.body.innerHTML = printContents; window.print(); document.body.innerHTML = originalContents; } </script> <div id="div_print"> <div id="header" style="background-color:White;"></div> <div id="footer" style="background-color:White;"></div> </div>
- 对于Fire2x而言 ，
在例子中添加moznomarginboxes属性：
<html moznomarginboxes mozdisallowselectionprint>
如果你碰巧向下滚动到这一点，我find了一个Firefox的解决scheme。 它将打印来自特定的div没有页脚和标题的内容。 你可以自定义你想要的。
首先，下载并安装这个插件： JSPrintSetup 。
其次，写这个函数：
<script> function PrintElem(elem) { var mywindow = window.open('', 'PRINT', 'height=400,width=600'); mywindow.document.write('<html><head><title>' + document.title + '</title>'); mywindow.document.write('</head><body >'); mywindow.document.write(elem); mywindow.document.write('</body></html>'); mywindow.document.close(); // necessary for IE >= 10 mywindow.focus(); // necessary for IE >= 10*/ //jsPrintSetup.setPrinter('PDFCreator'); //set the printer if you wish jsPrintSetup.setSilentPrint(1); //sent empty page header jsPrintSetup.setOption('headerStrLeft', ''); jsPrintSetup.setOption('headerStrCenter', ''); jsPrintSetup.setOption('headerStrRight', ''); // set empty page footer jsPrintSetup.setOption('footerStrLeft', ''); jsPrintSetup.setOption('footerStrCenter', ''); jsPrintSetup.setOption('footerStrRight', ''); // print my window silently. jsPrintSetup.printWindow(mywindow); jsPrintSetup.setSilentPrint(1); //change to 0 if you want print dialog mywindow.close(); return true; } </script>
第三，在你的代码中，无论你想写打印代码，这样做（我已经使用JQuery，你可以使用普通的javascript）：
<script> $("#print").click(function () { var contents = $("#yourDivToPrint").html(); PrintElem(contents); }) </script>
很明显，你需要链接点击：
<a href="#" id="print">Print my Div</a>
而你的div打印：
<div id="yourDivToPrint">....</div>
你不必编写任何代码。 在第一次调用window.print（）之前改变浏览器的打印设置。 例如在Firefox中：
- 按Alt或F10查看菜单栏
- 点击文件，然后点击页面设置
- select选项卡边距和页眉/页脚
- 更改空白 – > 图片的 URL
和IE另一个例子（我使用IE 11的以前的版本，你可以看到这个阻止Firefox或Internet Explorer的每页上打印的URL ）：
- 按Alt或F10查看菜单栏
- 点击文件，然后点击页面设置
- 在页眉和页脚部分更改URL为空。
