ホームページ  >  記事  >  ウェブフロントエンド  >  Chrome の印刷出力から Href 値を削除するにはどうすればよいですか?

Chrome の印刷出力から Href 値を削除するにはどうすればよいですか?

Susan Sarandon
Susan Sarandonオリジナル
2024-11-02 08:36:03229ブラウズ

How to Remove Href Values from Chrome Print Output?

Chrome の印刷出力で Href 値を削除する

Chrome で印刷 CSS をカスタマイズすると、リンクが両方の CSS で印刷されるという問題が発生することがあります。テキストコンテンツとhref値。これを解決するには、次の手順に従います。

参考として、初期 HTML を次に示します。

<a href="http://www.google.com">Google</a>

ブートストラップのデフォルト動作:

ブートストラップには、括弧内のリンクに href 値を追加するスタイルシートを印刷します:

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

Bootstrap のスタイルの無効化または上書き:

href 値を削除するには、Bootstrap のスタイルを変更することができます。スタイルシートを印刷するか、独自にオーバーライドします:

Bootstrap のスタイルを無効にする:

Bootstrap の印刷スタイルシートから a[href]:after ルールを削除します。

スタイルのオーバーライド:

新しい a[href]:after ルールを独自の印刷スタイルシートに追加し、内容を設定します: none !重要; Bootstrap のスタイルを無効にするには:

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

これらの変更を実装した後、リンクは必要に応じてテキスト コンテンツのみを印刷します:

Google

以上がChrome の印刷出力から Href 値を削除するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。