我有一个链接在我的网页打印网页。但是,在打印输出本身中也可以看到该链接。

是否有javascript或HTML代码,将隐藏链接按钮时,我点击打印链接?

例子:

 "Good Evening"
 Print (click Here To Print)

我想在打印文本“Good Evening”时隐藏这个“Print”标签。“打印”标签不应该显示在打印输出本身上。


当前回答

Bootstrap 3有自己的类,叫做:

hidden-print

它的定义如下:

@media print {
  .hidden-print {
    display: none !important;
  }
}

你不需要自己定义它。


在Bootstrap 4和Bootstrap5中,这已更改为:

.d-print-none

其他回答

Bootstrap 3有自己的类,叫做:

hidden-print

它的定义如下:

@media print {
  .hidden-print {
    display: none !important;
  }
}

你不需要自己定义它。


在Bootstrap 4和Bootstrap5中,这已更改为:

.d-print-none

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=x.x.x" media="print" rel="stylesheet" type="text/css" >

元素

<div class="no-print"></div>

最好的方法是创建页面的“仅打印”版本。

哦,等等…现在已经不是1999年了。使用带有“display: none”的打印CSS。

在样式表中添加:

@media print
{    
    .no-print, .no-print *
    {
        display: none !important;
    }
}

然后在你不想在打印版本中出现的HTML中添加class='no-print'(或将no-print类添加到现有的类语句中),比如你的按钮。

如果Javascript干扰了单个元素的style属性,从而重写了!important,我建议在打印前和打印后处理事件。https://developer.mozilla.org/en-US/docs/Web/API/WindowEventHandlers/onbeforeprint