从媒体打印屏幕中删除链接引用

Question

我遇到一个小问题，我无法从打印视图中删除链接引用。

这就是我在HTML方面可以做到的

<table style="width: 436px; height: 374px;" border="0" cellpadding="5">
    <tbody>
        <tr style="background-color: #edfbef;">
            <td><span style="color: #3366ff;"><a title="Electricity Tariffs and Rates" href="http://newfea.oceanic.net.fj/your-home/electricity-tariffs-and-rates/"><span style="color: #3366ff;"><strong>Electricity Tariff &amp; Rates</strong></span></a></span></td>
            <td>Find out how you are being charged for the power you use at home</td>
        </tr>
    </tbody>
</table>

这是我在header.php页面上用于媒体查询的内容

<link href="<?php echo get_template_directory_uri(); ?>/resources/css/print.css" rel="stylesheet" media="print">

这是快照，它在普通HTML视图中的外观

这是媒体印刷的愿景

您可以从打印视图中看到链接的链接参考。 有没有一种方法可以使用CSS删除它。

我试过了display：none ， 可见性：hidden ，它不是因为它隐藏了整个链接文本。

Answer 1

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

尝试用上述代码覆盖您的print media 。

Answer 2

参考链接： 此处

<span class="printonly"><strong>Electricity Tariff &amp; Rates</strong></span>

在TD上添加此新范围。

[注意：仅将PRINT的“ printonly”类添加到NEW <td>。

---

使用随附的CSS进行打印时，我们将隐藏在TD之下

[注意：将类别“无印刷品”添加到您的<td>中]

  <span class="withoutprint" style="color: #3366ff;">
     .....
       .....

---

的CSS

.printonly{
    display:none;
}
    @media print {
    .withoutprint{
        display: none;
    }
    .printonly{
        display:block;
        color: red;
    }
}

Answer 3

这些链接位于样式表中。 我猜您已经使用了主题或样板 。

检查这些样式表中的打印样式。

您正在寻找这样的东西：

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

您可能要删除它。

Answer 4

尝试这样：

CSS：

@media only print {
    a { text-decoration: none; color: black; cursor: default; }
}

@media only screen {
    a { cursor: pointer; }
}

演示