防止div及其内容被打印

Question

我有一个打印页面，我想在div中添加一些如何在其中打印页面的说明。我不希望在实际打印页面时显示此部分。

我如何使用CSS或JavaScript实现这一目标？

Answer 1

一种常见的方法是使用单独的CSS进行打印。 您可以拥有所有媒体的CSS和一个用于打印的CSS：

<link rel="stylesheet"
   type="text/css"
   media="print" href="print.css" />

在print.css中，只需在div上显示display：none。

的Davide

Answer 2

由于之前没有说明，您不一定需要外部样式表：

<style type="text/css" media="print">
 .hideMeInPrint { display: none; }
</style>

Answer 3

最简单的解决方案是在主CSS文件中添加它。请注意，当您链接CSS文件时，不应指定媒体属性（<link type="text/css" rel="stylesheet" href="/path/to/css.css" />）：

@media print {
   div.classname {
     display:none;
   }
}

Answer 4

您正在寻找@media print。

Answer 5

您可以添加仅在打印时应用的样式表。

<LINK REL="stylesheet" TYPE="text/css" MEDIA="print" HREF="print-specific-styles.css">

在该样式表中，您可以隐藏您的div并进行任何其他必要的更改。

Answer 6

http://www.webcredible.co.uk/user-friendly-resources/css/print-stylesheet.shtml

有关打印样式表的更多信息

Answer 7

插入样式表仅用于打印：

<link rel="stylesheet" href="/path/print.css" media="print" />

然后把css隐藏在样式表中的div

Answer 8

<link type="text/css" rel="stylesheet" media="print" href="/css/print.css" />

在这个css文件样式中放置display：none;对于您不想打印的元素

Answer 9

在你的html中，指出用于打印的样式表：

<link rel="stylesheet" type="text/css" media="print" href="print.css"/>

在这个CSS中：

#mydiv {display: none;}

Answer 10

任何在div内部使用div的人都会接受Divya的推荐。我花了好几个小时，直到遇到这个，把它放到外部和所有类的其他代码中使用php页面，效果很好:)另外，使用bootstraps效果很好，而bootstrap可以忽略并仍然打印。

@media print {
   div.classname {
     display:none;
   }
}