Entfernen von Href-Werten in der Chrome-Druckausgabe

Beim Anpassen von Druck-CSS in Chrome kann es zu einem Problem kommen, bei dem Links mit beiden gedruckt werden Textinhalt und der href-Wert. Um dieses Problem zu beheben, führen Sie die folgenden Schritte aus:

Als Referenz finden Sie hier den ursprünglichen HTML-Code:

Google

Bootstraps Standardverhalten:

Bootstrap enthält ein Druck-Stylesheet, das den href-Wert an Links in Klammern anhängt:

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

Deaktivieren oder Überschreiben des Bootstraps-Stils:

Um die href-Werte zu entfernen, können Sie entweder das Druck-Stylesheet von Bootstrap ändern oder es in Ihrem eigenen überschreiben:

Deaktivieren des Bootstraps-Stils:

Entfernen Sie die a[href]:after-Regel aus dem Druck-Stylesheet von Bootstrap.

Überschreiben des Stils:

Fügen Sie eine neue a[href]:after-Regel zu Ihrem eigenen Druck-Stylesheet hinzu und legen Sie den Inhalt fest: none !important; So deaktivieren Sie Bootstraps Styling:

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

Nach der Implementierung dieser Änderungen drucken Links wie gewünscht nur den Textinhalt aus:

Google