打印页面时隐藏 HTML div
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/12218189/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
hide HTML div when printing page
提问by steeped
I have a XHTML-based page which contains admin information. The admin should be able to print the page, but I would like it to hide their information.
我有一个基于 XHTML 的页面，其中包含管理信息。管理员应该能够打印页面，但我希望它隐藏他们的信息。
Is there a way to set a print area when printing a page, or is the only viable solution to open up a secondary page without the admin information when clicking on the "print" button?
有没有办法在打印页面时设置打印区域，或者是单击“打印”按钮时在没有管理信息的情况下打开二级页面的唯一可行解决方案？
Thank you!
谢谢！
回答by nickel715
try this:
尝试这个：
<style type="text/css" media="print">
.dontprint
{ display: none; }
</style>
<div class="dontprint">I'm only visible on the screen</div>
回答by Gary
You can set the CSS for that div to display: noneusing the following:
您可以将该 div 的 CSS 设置为display: none使用以下内容：
@media print {
div.do-not-print {display: none;}
}
It'll display normally, but when you go to print, it'll use that CSS class.
它会正常显示，但是当你去打印时，它会使用那个 CSS 类。
回答by Slavenko Miljic
Add print.css to your page in which you hide all the elements that you don't want to be printed
将 print.css 添加到您的页面中，您可以在其中隐藏您不想打印的所有元素
<link rel="stylesheet" href="print.css" type="text/css" media="print" />
the media="print" attribute tells the browser to use specific css file.
media="print" 属性告诉浏览器使用特定的 css 文件。
In that file you can have
在该文件中，您可以拥有
.admindetails{
display:none;
}
回答by Santosh Khalse
Sure, You can add a diffrent stylesheet for printing, See below example
当然，您可以添加不同的样式表进行打印，请参见下面的示例
<link href="print.css" rel="stylesheet" type="text/css" media="print" />
or in exiting stylesheet, you can add media query
或者在退出样式表中，您可以添加媒体查询
@media print {
.no-print {display: none;}
}
And add .no-print class where you do not want to print HTML element
并在您不想打印 HTML 元素的地方添加 .no-print 类
