Bootstrap 3.1.1页面:隐藏链接的URL

时间:2014-04-11 21:21:00

标签: html css twitter-bootstrap printing responsive-design

我有一个Bootstrap 3.1.1页面,我想在进行打印/打印预览时隐藏链接的URL。我怎么能这样做?

我想显示链接本身,如“购物车”,“我的帐户”等,但不想显示链接。

正在发生的事情的屏幕截图: http://i.imgur.com/CQoqVyN.png

3 个答案:

答案 0 :(得分:10)

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

答案 1 :(得分:7)

@iamnotsam是对的。我需要在内容之后添加!important以使其工作。

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

答案 2 :(得分:1)

在我的页面上,大多数时候我都喜欢Bootstrap在锚标记之后打印URL的默认行为。我决定从某个类的链接中删除网址,而不是默认删除所有网址。

尝试与Bootstrap的类命名方案保持一致,对于我不希望看到后面打印的URL的每个链接,我给了锚标记hidden-print-href

然后,我将以下几行添加到我的网站样式表中。

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