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

How to Remove Printed Href Values in Chrome?

Linda Hamilton
Linda HamiltonOriginal
2024-11-03 01:26:29906browse

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>

Print Output:

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

Desired Print Output:

<code class="text">Google</code>

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>

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!

Statement:
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