Home > Web Front-end > CSS Tutorial > How to Remove Printed Href Values in Chrome?

How to Remove Printed Href Values in Chrome?

Linda Hamilton
Release: 2024-11-03 01:26:29
Original
887 people have browsed it

How to Remove Printed Href Values in Chrome?

Removing Href Values During Chrome Printing

When attempting to customize print CSS styles in Chrome, you may encounter an issue where links are printed with their href values appended. This can lead to undesirable output, as seen in the following example:

HTML:

<code class="html"><a href="http://www.google.com">Google</a></code>
Copy after login

Print Output:

<code class="text">Google (http://www.google.com)</code>
Copy after login

Desired Print Output:

<code class="text">Google</code>
Copy after login

To rectify this issue, you can leverage a solution similar to that proposed in the selected answer. Bootstrap, for instance, inserts after-content linking href values to the printed text through CSS. To disable this behavior, simply remove or override the relevant CSS rule in your print stylesheet:

<code class="css">@media print {
  a[href]:after {
    content: none !important;
  }
}</code>
Copy after login

By applying this CSS rule, you can effectively suppress the printing of href values, resulting in a cleaner and more concise printed output.

The above is the detailed content of How to Remove Printed Href Values in Chrome?. For more information, please follow other related articles on the PHP Chinese website!

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Articles by Author
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template