Gmail从电子邮件中剥离链接颜色？答案

【问题标题】：Gmail stripping link color from emails?Gmail从电子邮件中剥离链接颜色？
【发布时间】：2012-02-02 10:00:39
【问题描述】：

除了链接颜色之外，一切都很好。这些是我的链接。

<a href="http://www.facebook.com.." style="color:#000000;text-decoration:none;font-weight:bold">Facebook</a>

<a href="http://www.twitter.com/..." style="color:#000000;">Twitter</a>

但是，在 gmail 中。这些链接将转换为此。

<a href="http://www.facebook.com.." style="text-decoration:none;font-weight:bold">Facebook</a>

<a href="http://www.twitter.com/..." style="">Twitter</a>

好的，也许 gmail 对所有电子邮件都这样做？我环顾四周。很多蓝色链接。然后我打开一条 youtube 消息。

<a target="_blank" style="color:#e12e31;font-family:arial,verdana,sans-serif;text-transform:uppercase;text-decoration:none" href="...">Play all »</a>

很好奇..很好奇。 YouTube 没有我遇到的这个问题。发送 html 电子邮件时，其他人可以修改 gmail 中的链接颜色吗？你做得怎么样？

【问题讨论】：

标签： html gmail anchor

【解决方案1】：

我在 Gmail 中的链接也有类似的问题，但仅限于 color: #000000;它把它改成了默认的蓝色。

我把颜色改成深灰色，效果很好。

【讨论】：

#ffffff 也会发生同样的情况 - 但#fefefe 不会发生这种情况

【解决方案2】：

GMail 会将您的链接从黑色 (#000000) 更改为默认的蓝色，这可能是作为一种反垃圾邮件功能。

要解决这个问题，只需将字体颜色更改为 (#000001)，例如

<a href="#" style="color: #000001;">Click HERE</a>

【讨论】：

【解决方案3】：

在这里结合答案对我来说就像是一种魅力，例如：

color: #000001 !important;

我希望我们在这里没有帮助垃圾邮件发送者等...

【讨论】：

我确认 !important 关键字的作用就像一个魅力
也确认了，它甚至可以在 head/style 标签 (2014-07) a {color:red !important;} 中使用。快速浏览一下网络检查器，结果发现自定义颜色已声明，但来自 gmail 的包装 div 样式否决了样式。 !important 关键字成功了。
@ChrisMoschini 很好.. 它只工作了 6 年.. 但感谢您的反对...（我还没有测试它现在是否不起作用）
@OZZIE 是的，StackOverflow 有点奇怪，我得到了同样问题的答案。为了对此持积极态度，我将其视为使用最新信息更新出色答案的动力，因为当技术从旧的、现在不正确的答案中扫出时。我的关于 .Net JPEG 的文章已经更新了 6 次。

【解决方案4】：

我为我的电子邮件签名所做的是将电话号码放在中间的点而不是破折号，比如这个 226·860·XXXX，没有更多的蓝色超链接！希望这可以帮助某人

【讨论】：

没有回答问题，但还是帮助了我。 ;)
也可以使用“零空间”html实体避免 IOS 将任何数字（如增值税）转换为可点击的链接。只需在您的数字之间插入字符即可打破这种 ios 行为

【解决方案5】：

不幸的是，这里的所有答案似乎都是针对 2016/2017 更新之前的旧版 Gmail。 2016 年之前提供的答案均无效。

在现代 Gmail 网页版和 Android 版 Gmail 中，您需要通过设置背景颜色来让 Gmail 误以为您正在尝试设置链接按钮的样式：

a.btn {
  color: #fff;
  background: #ffa100;
  text-decoration: none;
  text-transform: uppercase;
  padding: 5px 12px 6px 12px;
  border-radius: 5px;
  box-shadow: 0 3px 6px rgba(0,0,0,.18);
}

为了好奇，它变成了这个样式，作为最后一个样式标签注入到整个 Gmail 网页的头部：

.msg-6177286137221397679 a.m_-6177286137221397679btn{
    color:#fff;
    background:#ffa100;
    text-decoration:none;
    text-transform:uppercase;
    padding:5px 12px 6px 12px;
    border-radius:5px
}

这一切都与实际 Gmail 中的其他样式在一个缩小的行中；我在这里轻轻地漂亮地打印了它以进行比较。你可以看到我的 box-shadow 被扔掉了，但这并没有破坏整个风格规则。您还可以看到其他一些大家都说您无法在 Gmail 中做的重要事情，但事实证明这些事情不再正确：

填充工作正常
标签级样式有效 - 也就是说，它是 a.btn，而大多数 Gmail 建议告诉您永远不要使用标签样式，而只应用类级样式

虽然像上面这样的链接按钮可能是 Gmail 所希望的，但您可以使用它来欺骗它，例如：

body {
    background: #ededed;
}
table.main a {
    color: #1c95cd;
    background: #ededed;
}

这就够了，您的链接颜色样式仍然存在，因为 Gmail 天真地认为这是一个链接按钮。

【讨论】：

【解决方案6】：

我可以设置颜色链接，只需在电子邮件头中添加以下样式：

<style>
      a, a:visited, .ii a[href] { color:#E5322C!important; text-decoration:none;}
      a:hover, .ii a[href]:hover{ text-decoration:underline;}
</style>

唯一需要注意的是“a”选择器还不够，因为 Gmail 向 .ii a[href] 添加了一条规则，但为该选择器添加规则可以解决我的链接颜色问题。它甚至适用于被 Gmail 转换为链接的 URL、电子邮件和电话号码。无需添加内联样式。

【讨论】：

这在 2015 年可能是正确的，但这在今天的 Gmail 中绝对行不通。
这工作得很好，甚至：a { color: #0371e8 !important; } 工作。

【解决方案7】：

您必须确保将代码插入到 HTML 中的适当位置，在要链接的文本之前（显然），并且 style="color:#ffffff;" 元素正确嵌套在标记中。

当然不要忘记在文本链接的背面添加您的</a> 标签。在 Gmail 中查看时，这对我来说很好。

<a target="_blank" style="color:#ffffff;"  href="http://yoursite.com">Custom Color Link in Gmail</a>

【讨论】：

这个答案不是很有帮助。该问题的示例没有遇到您引用的任何问题。