【CSS】印刷するとリンクの後ろにURLが勝手に表示される

Tweet

Category css 2013/01/20

問題

あるWebページを印刷すると、リンクの後ろにURLが表示されました。

ぜんぜん見た目どおりでなくて、ちょっと困るのですが。。。

答え

以下のようなCSSが組み込まれていると、a要素でhref属性がある場合、印刷時に、要素の後ろにリンク先が挿入されます。

@media print {
/* 省略 */
  a[href]:after {
    content: " (" attr(href) ")";
  }
  abbr[title]:after {
    content: " (" attr(title) ")";
  }
/* 省略 */
}

最近の Twitter Bootstrap などがそうなっているようです。

どうしても困る場合は、CSSの該当部分を削除してしまえばよいです。