我试图自定义打印CSS,并发现它打印出的链接与href值以及链接。
href
这是Chrome。
对于这个HTML:
<a href="http://www.google.com">Google</a>
它打印:
Google (http://www.google.com)
我想打印:
Google
它不。在你的打印样式表的某处,你必须有这段代码:
a[href]::after { content: " (" attr(href) ")" }
唯一的另一种可能是你有一个分机为你做。
Bootstrap做同样的事情(…如下所选答案)。
@media print { a[href]:after { content: " (" attr(href) ")"; } }
只需要从那里删除它,或者在你自己的打印样式表中重写它:
@media print { a[href]:after { content: none !important; } }
如果您使用以下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" />
只需通过添加媒体= "屏幕"将其更改为以下样式
<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" />
我认为它会起作用。
前者的回答是
不是很好地工作在chrome浏览。
我遇到了一个类似的问题,只有嵌套的img在我的锚:
<a href="some/link"> <img src="some/src"> </a>
当我申请的时候
由于某种原因,我失去了img和整个锚点宽度,所以我使用:
@media print { a[href]:after { visibility: hidden; } }
效果很好。
小贴士: 检查打印预览
正常用户。打开当前页面的检查窗口。 然后输入:
l = document.getElementsByTagName("a"); for (var i =0; i<l.length; i++) { l[i].href = ""; }
然后你将不会看到打印预览的url链接。
@media print { a[href]:after { display: none; visibility: hidden; } }
工作是完美的。
隐藏页面url。
在style tage示例中使用media="print":
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; } }