打印网页时如何隐藏元素？
我在我的网页上有一个链接来打印网页。 但是，链接在打印输出中也是可见的。
是否有JavaScript或HTML代码，当我点击打印链接时会隐藏链接按钮？
例：
"Good Evening" Print (click Here To Print) 我想在打印文本“晚上好”时隐藏这个“打印”标签。 “打印”标签不应该显示在打印输出本身上。
在你的样式表中添加：
@media print { .no-print, .no-print * { display: none !important; } }
然后在HTML中添加class='no-print' （或将no-print类添加到现有的类语句中），而不希望在打印版本中出现，如按钮。 我得到这个“noPrint”而不是“noprint”（小写）。
最佳做法是使用专门用于打印的样式表 ，并设置其media属性以进行print 。
其中，显示/隐藏您想要在纸上打印的元素。
<link rel="stylesheet" type="text/css" href="print.css" media="print" />
Bootstrap有这个自己的类叫：
hidden-print
它是这样定义的：
@media print { .hidden-print { display: none !important; } }
你不必自己定义它。
CSS文件
@media print { #pager, form, .no-print { display: none !important; height: 0; } .no-print, .no-print *{ display: none !important; height: 0; } }
HTML标头
<link href="/theme/css/ui/ui.print.css?version=xxx" media="print" rel="stylesheet" type="text/css" >
元件
<div class="no-print"></div>
您可以将链接放在div中，然后在锚标签上使用JavaScript来单击时隐藏div。 例子（未经测试，可能需要调整，但你明白了）：
<div id="printOption"> <a href="javascript:void();" onclick="document.getElementById('printOption').style.visibility = 'hidden'; document.print(); return true;"> Print </a> </div>
缺点是，一旦点击，按钮消失，他们失去了页面上的选项（总是Ctrl + P虽然）。
更好的解决方案是创建一个打印样式表，并在该样式表中指定printOption ID的隐藏状态（或任何你所说的）。 您可以在HTML的头部分执行此操作，并指定具有媒体属性的第二个样式表。
这是一个简单的解决方案把这个CSS
<style> @media print{ #noprint{ display:none; } }
这里是HTML
<div id="noprint"> element that need to be hide when printing </div>
最好的办法是创建一个“只打印”版本的页面。
哦，等等…这不是1999年了。 使用“display：none”打印CSS。
@media print { .no-print { visibility: hidden; } }
<div class="no-print"> Nope </div> <div> Yup </div>
