Javascript 打印网站而不打印链接位置？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/3476393/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Print a website without printing the link locations?
提问by Adirael
I'm invoking the navigator print function using a simple window.print(); call. It prints perfect (I want to print the same I see on the screen, so I don't really use a special CSS to print) but it showing the link locations next to the text link, something like:
我正在使用一个简单的 window.print(); 调用导航器打印功能；称呼。它打印完美（我想打印我在屏幕上看到的相同内容，所以我并没有真正使用特殊的 CSS 来打印）但它显示了文本链接旁边的链接位置，例如：
Homepage (http://localhost)
To be clearer: I don't want to have the link locations near the links in the printed version, I have control over the CSS but I can't find this behaviour defined anywhere, so I think is a navigator-related issue!
更清楚一点：我不想在打印版本中的链接附近有链接位置，我可以控制 CSS，但我找不到在任何地方定义的这种行为，所以我认为这是一个与导航器相关的问题！
EDIT: This happens under Firefox 3.6.8 and the last Chrome, on Ubuntu an Windows XP/Vista.
编辑：这发生在 Firefox 3.6.8 和最后一个 Chrome 下，在 Ubuntu 和 Windows XP/Vista 上。
采纳答案by mplungjan
Seems you are printing a page with this styling from a CSS2 compliant browser
似乎您正在从符合 CSS2 的浏览器打印具有此样式的页面
http://www.alistapart.com/articles/goingtoprint/
http://www.alistapart.com/articles/goingtoprint/
In a fully CSS2-conformant browser, we can parenthetically insert the URLs of the links after each one, thus making them fairly useful to anyone who has a copy of the printout and a web browser handy. Here's the rule, which restricts this effect to the “content” div and thus avoids sticking a URL in the masthead:
在完全符合 CSS2 的浏览器中，我们可以在每个链接的 URL 后面加上括号，从而使它们对任何拥有打印输出副本和方便的 Web 浏览器的人都非常有用。这是规则，它将这种效果限制在“内容”div 上，从而避免在标头中粘贴 URL：
#content a:link:after, #content a:visited:after {
content: " ("attr(href) ") ";
font-size: 90%;
}
Try it out in a Gecko-based browser, like Mozilla or Netscape 6.x. After every link in the printout, you should see the URL of the link in parentheses.
在基于 Gecko 的浏览器中尝试一下，比如 Mozilla 或 Netscape 6.x。在打印输出中的每个链接之后，您应该会在括号中看到链接的 URL。
回答by mliebelt
So to avoid additional print-out of link information in a printed web page, add the following rules to the @media printsection:
因此，为了避免在打印的网页中额外打印出链接信息，请在该@media print部分添加以下规则：
a:link:after, a:visited:after {
content: "";
}
This will remove the ugly link information like Homepage (http://localhost)and reduce it to Homepage. You may of course add rules to avoid it only in the text section (or only in the navigation, but you shouldn't display navigation in the print-out format of your web page.
这将删除丑陋的链接信息，例如Homepage (http://localhost)并将其减少到Homepage. 您当然可以仅在文本部分（或仅在导航中）添加规则来避免它，但您不应以网页的打印输出格式显示导航。
回答by Dajo
content: ""; does not work I use this:
内容： ””; 不起作用我用这个：
@media print {
.noprint {display:none !important;}
a:link:after, a:visited:after {
display: none;
content: "";
}
}
This works to disable!
这可以禁用！
回答by tgursk
Currently using the content property should work in all major browsers.
当前使用 content 属性应该适用于所有主要浏览器。
@media print - or - <style type="text/css" media="print">
a:link:after, a:visited:after {
content: normal; //TODO: add !important if it is overridden
}
More options here: CSS Content.
这里有更多选项：CSS 内容。
More usefull ways of using the content attribute here: CSS Tricks
在此处使用 content 属性的更有用的方法：CSS Tricks
回答by Jeroen K
I found the other solutions don't work (anymore) cross-browser. The following works in FF 29, Chrome 35, IE 11:
我发现其他解决方案（不再）跨浏览器不起作用。以下适用于 FF 29、Chrome 35、IE 11：
a:link:after, a:visited:after {
content: normal !important;
}
回答by coloradoblue
My app server (rails) required me to use a parent selector. The bodyelement is perfect for selecting what should be the entire page.
我的应用服务器 (rails) 要求我使用父选择器。该body元素非常适合选择应该是整个页面的内容。
body a:link:after, body a:visited:after {
content: "";
}
回答by Mike Chelen
For anyone using Bootstrap 3, the selector used is:
对于使用 Bootstrap 3 的任何人，使用的选择器是：
a[href]:after { }
And can be overriden with something like:
并且可以用以下内容覆盖：
a[href]:after {
content: initial;
}
回答by Mohd Abdul Mujib
While many css options have been suggested, if you wish to get rid of the links and headings in the header/footer which is forced on each page, there is a setting just for you. As shown below.
虽然已经建议了许多 css 选项，但如果您希望摆脱每个页面上强制使用的页眉/页脚中的链接和标题，则有一个适合您的设置。如下所示。
That's it.
就是这样。
回答by Rudias
Adding this will help you to remove those unwanted links
添加这将帮助您删除那些不需要的链接
<style type="text/css" media="print">
@page
{
size: auto; /* auto is the initial value */
margin: 0mm; /* this affects the margin in the printer settings */
}
回答by Mchl
Use additional CSS for print.
使用额外的 CSS 进行打印。
See here: http://www.webcredible.co.uk/user-friendly-resources/css/print-stylesheet.shtml
见这里：http: //www.webcredible.co.uk/user-friendly-resources/css/print-stylesheet.shtml
