Removing Href Values in Chrome Print Output

When customizing print CSS in Chrome, you may encounter an issue where links are printed with both the textual content and the href value. To resolve this, follow these steps:

For reference, here's the initial HTML:

Google

Bootstrap's Default Behavior:

Bootstrap includes a print stylesheet that appends the href value to links in parentheses:

@media print {
  a[href]:after {
    content: " (" attr(href) ")";
  }
}

Disabling or Overriding Bootstrap's Style:

To remove the href values, you can either modify Bootstrap's print stylesheet or override it in your own:

Disabling Bootstrap's Style:

Remove the a[href]:after rule from Bootstrap's print stylesheet.

Overriding the Style:

Add a new a[href]:after rule to your own print stylesheet and set content: none !important; to disable Bootstrap's styling:

@media print {
  a[href]:after {
    content: none !important;
  }
}

After implementing these changes, links will print only the textual content, as desired:

Google