Question

我正在尝试仅打印选定的文档区域。我尝试将所选区域/ div的内容添加到新窗口并调用window.print，但问题出现在css上。由于我的页面有来自多个文件的CSS，因此我很难再次加载这些css文件。

所以我需要将带有内嵌样式的选定区域/ div内容导出到新文档并打印出来。

Answer 1

首先，如果您的外部样式表对您的打印输出的弊大于利，您可以使用简单的媒体查询将它们限制为屏幕媒体：<link rel="stylesheet" href="style.css" media="screen,projection" />

这样，您的打印样式表可以从没有样式的页面开始，而不必重置任何以前的页面。

典型的打印样式表会隐藏广告，将颜色重置为高对比度颜色并调整排版 - 请查看HTML5 Boilerplate的the print section。

如果“选择区域”是指用户可以决定需要打印的内容，您可以通过对JavaScript处理程序执行.addClass('print');之类的操作轻松实现此目的，然后您的打印CSS可能如下所示：

* {display: none;}
.print, .print * {display: block;} /* Or inline, depending on the element */

如果你不关心IE＆lt; 9，你可以这样做：

body :not(.print) {display: none;}

Answer 2

您可以使用打印介质类型指定一个CSS文件，该文件仅在您打印时才适用于您的页面。您可以隐藏打印CSS文件中的所有不必要的元素。