我正在尝试自定义打印CSS,并发现它使用href
值和链接打印出链接。
这是在Chrome中。
对于这个HTML:
<a href="http://www.google.com">Google</a>
打印:
Google (http://www.google.com)
我希望它打印出来:
Google
答案 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)
@media print {
a[href]:after {
display: none;
visibility: hidden;
}
}
&#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;
}
}
完美无缺。
答案 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 = "";
}
然后你不会在打印预览中看到网址链接。