我正在尝试仅打印文档的选定区域。我尝试将所选区域/div的内容添加到新窗口并调用window.print,但出现了关于css的问题。由于我的页面包含来自多个文件的 css,因此我很难再次加载这些 css 文件。
所以我需要将选定的区域/div 内容与内联样式导出到新文档并打印出来。
我正在尝试仅打印文档的选定区域。我尝试将所选区域/div的内容添加到新窗口并调用window.print,但出现了关于css的问题。由于我的页面包含来自多个文件的 css,因此我很难再次加载这些 css 文件。
所以我需要将选定的区域/div 内容与内联样式导出到新文档并打印出来。
首先,如果您的外部样式表对您的打印输出弊大于利,您可以通过简单的媒体查询将它们限制为屏幕媒体:<link rel="stylesheet" href="style.css" media="screen,projection" />
这样,您的打印样式表可以从无样式的页面开始,而不必重置任何以前的表格。
典型的打印样式表会隐藏广告、将颜色重置为高对比度颜色并调整排版 - 看看HTML5 Boilerplate的打印部分。
如果“选定区域”是指用户可以决定需要打印的内容,您可以通过.addClass('print');
对 JavaScript 处理程序执行类似操作轻松实现该目标,然后您的打印 CSS 可能如下所示:
* {display: none;}
.print, .print * {display: block;} /* Or inline, depending on the element */
如果你不关心 IE<9,你可以这样做:
body :not(.print) {display: none;}
您可以使用打印媒体类型来指定仅在您打印页面时应用到您的页面的 CSS 文件。您可以在打印 CSS 文件中隐藏所有不必要的元素。