邮件反向超链接文本

Question

我如何使用CSS反向方法来反转电子邮件地址以防止添加超链接的垃圾邮件？ 所以我的页面会说这样的话： 请联系网站管理员。

我希望当用户点击或悬停网站管理员文字时，该电子邮件可用。

没有超链接它工作正常，但我不确定结构如何变化。

Please report errors to the webmaster - <span class="reverse">ku.oc.evil@cba</span>

-

.reverse {
    unicode-bidi: bidi-override;
    direction: rtl;
}

初始状态：https://jsfiddle.net/kfey3wxu/

Answer 1

抱歉，我误解了你的问题，我重新阅读了。我已将此添加到您的CSS中：

div:hover + .reverse {
    unicode-bidi: bidi-override;
    direction: rtl;
}

然后，在您的HTML中，我向您的网站管理员添加了一个div。

Please report errors to the
<div>webmaster</div>- <span class="reverse">ku.oc.evil@cba</span>

这是JSFiddle。我希望这就是你想要的。

Answer 2

<强> jsBin demo

你使用的技巧不会阻止机器人。

我可以告诉你一种阻止大多数（所有，直到现在：D）嗅探机器人的方式， 那是使用JS（jQuery）：

Contact us at: <span data-yumm="com">some.name\website</span>

反斜杠\（您也可以使用"但我不建议。）不能用作有效的电子邮件 - 任何事情我们都可以将其用作{{1替换者。

在这里，97％的机器人会消失，因为在野外有很多网站，他们会发现他们感兴趣的@指针并且不会在你的页面上浪费太多时间:)

现在是我们亲爱的用户和jQuery的时候了：

@

仍然有一些机器人有超时等待你的页面被加载但是......嘿，还有人类机器人为这份工作付钱而且很遗憾你不知道他们是谁是为了提高出价;）

要将相同内容转换为$('[data-yumm]').text(function(i, v){ return v.replace("\\", "@") +"."+ $(this).data("yumm"); }); 链接，请使用以下命令：

mailto: