在Chrome中打印时需要删除href值

时间:2011-09-04 20:40:45

标签: css printing hyperlink print-css

我正在尝试自定义打印CSS,并发现它使用href值和链接打印出链接。

这是在Chrome中。

对于这个HTML:

<a href="http://www.google.com">Google</a>

打印:

Google (http://www.google.com)

我希望它打印出来:

Google

7 个答案:

答案 0 :(得分:572)

Bootstrap做同样的事情(......如下面的选定答案)。

@media print {
  a[href]:after {
    content: " (" attr(href) ")";
  }
}

只需将其从那里删除,或在您自己的打印样式表中覆盖它:

@media print {
  a[href]:after {
    content: none !important;
  }
}

答案 1 :(得分:39)

It doesn't。在打印样式表的某处,您必须拥有以下代码段:

a[href]::after {
    content: " (" attr(href) ")"
}

唯一的另一种可能性是你有一个为你做的扩展。

答案 2 :(得分:17)

&#13;
&#13;
@media print {
   a[href]:after {
      display: none;
      visibility: hidden;
   }
}
&#13;
&#13;
&#13;

工作完美。

答案 3 :(得分:9)

如果您使用以下CSS

<link href="~/Content/common/bootstrap.css" rel="stylesheet" type="text/css"    />
<link href="~/Content/common/bootstrap.min.css" rel="stylesheet" type="text/css" />
<link href="~/Content/common/site.css" rel="stylesheet" type="text/css" />

只需添加 media =&#34; screen&#34;

,即可将其更改为以下样式
<link href="~/Content/common/bootstrap.css" rel="stylesheet" **media="screen"** type="text/css" />
<link href="~/Content/common/bootstrap.min.css" rel="stylesheet" **media="screen"** type="text/css" />
<link href="~/Content/common/site.css" rel="stylesheet" **media="screen"** type="text/css" />

我认为它会奏效。

前者的答案如

    @media print {
  a[href]:after {
    content: none !important;
  }
}

在Chrome浏览器中效果不佳。

答案 4 :(得分:4)

我的锚点中只有嵌套的img遇到了类似的问题:

<a href="some/link">
   <img src="some/src">
</a>

申请时

@media print {
   a[href]:after {
      content: none !important;
   }
}

由于某种原因,我丢失了我的img和整个锚点宽度,所以我使用了:

@media print {
   a[href]:after {
      visibility: hidden;
   }
}

完美无缺。

奖金提示inspect print preview

答案 5 :(得分:0)

隐藏页面网址。

在样式示例中使用media="print"

<style type="text/css" media="print">
            @page {
                size: auto;   /* auto is the initial value */
                margin: 0;  /* this affects the margin in the printer settings */
            }
            @page { size: portrait; }
</style>

如果要删除链接:

@media print {
   a[href]:after {
      visibility: hidden !important;
   }
}

答案 6 :(得分:-2)

对于普通用户。打开当前页面的检查窗口。 输入:

l = document.getElementsByTagName("a");
for (var i =0; i<l.length; i++) {
    l[i].href = "";
}

然后你不会在打印预览中看到网址链接。