Html Gmail 从电子邮件中去除链接颜色?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/9110327/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-28 22:14:32  来源:igfitidea点击:

Gmail stripping link color from emails?

htmlgmailanchor

提问by JasonS

Everything renders fine apart from link colors.. These are my links.

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

<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>

However, in gmail. These links are converted to this.

但是,在 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>

OK, so maybe gmail does this for all emails? I look around. Lots of blue links. I then open up a youtube message.

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

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

Curious.. very curious. YouTube isn't having this problem that I am having. Can anyone else modify link colors in gmail when sending html emails? How are you doing it?

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

回答by Vasco

I had a similar problem with links in Gmail, but only when color: #000000; it changed it to the default blue.

我在 Gmail 中遇到了类似的链接问题,但仅限于 color: #000000; 它将其更改为默认的蓝色。

I changed the color to a very dark grey and it worked.

我将颜色更改为非常深的灰色并且它起作用了。

回答by crmpicco

GMail will change your links from black (#000000) to the default blue, presumably as an anti-spamming feature.

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

To get around this, just change the color of the font to (#000001), e.g.

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

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

回答by OZZIE

Combining the answers here worked like a charm for me, eg:

结合这里的答案对我来说就像一个魅力,例如:

color: #000001 !important;

I hope we aren't helping spammers and such here...

我希望我们不会帮助垃圾邮件发送者等等...

回答by laura

What I did for my email signature, is put the phone number with a middle dot instead of a dash, like this 226·860·XXXX, no more blue hyperlink! hope this helps someone

我为我的电子邮件签名所做的是将电话号码放在中间点而不是破折号,例如 226·860·XXXX,不再有蓝色超链接!希望这有助于某人

回答by bluantinoo

I'm able to set color links just adding the following style in email head:

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

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

the only caveat is that the "a" selector is not enough, because Gmail adds a rule to .ii a[href], but adding rules for that selector fixes my links color issue. It works even on URLS, emails and telephone numbers that are converted into links by Gmail. There's no need to add inline styling.

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

回答by Chris Moschini

Unfortunately it appears all the Answers here are for older Gmail, prior to the 2016/2017 update. None of the Answers provided prior to 2016 here work.

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

In modern Gmail Web and Gmail for Android, you need to trick Gmail into thinking you're trying to style a link-button, by setting a background color:

在现代 Gmail Web 和 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);
}

For the curious, it becomes this style, injected as the last style tag in the head of the overall Gmail Web page:

出于好奇,它变成了这种样式,作为整个 Gmail 网页头部的最后一个样式标签注入:

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

It's all on one minified line with the rest of the styles in actual Gmail; I've gently pretty-printed it here for comparison. You can see my box-shadow was thrown out, yet that didn't kill the entire style rule. You can also see a couple other important things that everyone says you can't do in Gmail, that turn out to no longer be true:

它与实际 Gmail 中的其他样式都在一个缩小的行上;我已经轻轻地将它打印在这里以进行比较。你可以看到我的 box-shadow 被扔掉了,但这并没有破坏整个风格规则。您还可以看到一些其他重要的事情,每个人都说您不能在 Gmail 中执行这些操作,但事实证明这不再正确:

  • Padding is working
  • Tag-level style is working - that is, it's a.btn, whereas most Gmail advice tells you to never use tag styles, and only apply class-level styles
  • 填充正在工作
  • 标签级样式有效 - 也就是说,它是 a.btn,而大多数 Gmail 建议告诉您永远不要使用标签样式,而只应用类级样式

While a link-button like above is what Gmail is probably hoping for, you can trick it with, for example:

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

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

And that's enough, your link color style survives because Gmail naively considers this a link button.

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

回答by Ryan

You have to make sure that the you are inserting the code in the appropriate spot in your HTML, prior to the text you want to link up (obviously) and that the style="color:#ffffff;"element is properly nested within the tag.

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

And of course don't forget to include your </a>tag on the backside of the text link. This works fine for me when viewing in Gmail.

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

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