如何删除 HTML 电子邮件中的链接下划线？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8998378/
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
How do I remove link underlining in my HTML email?
提问by pubudumj
<td width="110" align="center" valign="top" style="color:#000000;">
<a href="https://example.com" target="_blank"
style="color:#000000; text-decoration:none;">BOOK NOW
</a>
</td>
I used this code to make a link in my HTML email. In browsers and Outlook it's working nicely, but in GMail, Hotmail, and ymail it shows links underlined.
我使用此代码在我的 HTML 电子邮件中创建链接。在浏览器和 Outlook 中它运行良好，但在 GMail、Hotmail 和 ymail 中它显示带下划线的链接。
Can anyone help me to get rid of this?
谁能帮我摆脱这个？
回答by Nathaniel Hoyt
<a href="#" style="text-decoration:none !important; text-decoration:none;">BOOK NOW</a>
Outlook will strip out the style with !importanttag leaving the regular style, thus no underline. The !importanttag will over rule the web based email clients' default style, thus leaving no underline.
Outlook 将去掉带有!important标记的样式，保留常规样式，因此没有下划线。该!important标签将超过基于 Web 的电子邮件客户端的默认样式，因此不会留下下划线。
回答by Kennith Nichol
I see this has been answered; however, I feel this link provides appropriate information for what formatting is supported in various email clients.
我看到这已经得到了回答；但是，我觉得此链接提供了有关各种电子邮件客户端支持的格式的适当信息。
http://www.campaignmonitor.com/css/
http://www.campaignmonitor.com/css/
It's worth noting that GMail and Outlook are two of the pickiest to format HTML email for.
值得注意的是，GMail 和 Outlook 是两种最挑剔的 HTML 电子邮件格式。
回答by TechyTee
Use !importantin the text decoration rule.
使用!important文本装饰规则。
<a href="#" style="text-decoration:none !important;">BOOK NOW</a>
回答by Tommy Bickerdike
After half a day looking into this (and 2 years since this question was opened) I believe I have found a comprehensive answer to this.
经过半天的研究（以及这个问题提出两年后），我相信我已经找到了一个全面的答案。
<a href="#"><font color="#000000"><span style='text-decoration:none;text-underline:none'>Link</span></font></a>
(You need the text-underline property on the span inside the link and the font tag to edit the colour)
（您需要链接内跨度上的 text-underline 属性和字体标签来编辑颜色）
回答by Bryan Labuschagne
Another way to fool Gmail (for phone numbers): use a ~ instead of a -
另一种欺骗 Gmail 的方法（对于电话号码）：使用 ~ 而不是 -
404-835-9421 --> 404~835~9421
404-835-9421 --> 404~835~9421
It'll save you (or less savvy users ;-) the trip down html lane.
它将为您（或不太精明的用户；-）节省 html 通道。
I found another way to remove links in outlook that i tested so far. if you create a blank class for example in your css say .blank {} and then do the following to your links for example:
我找到了另一种方法来删除迄今为止我测试过的 Outlook 中的链接。例如，如果您在 css 中创建一个空白类，请说 .blank {} 然后对您的链接执行以下操作，例如：
<a href="http://www.link.com/"><span class="blank" style="text-decoration:none !important;">Search</span></a>
this worked for me hopefully it will help someone who is still having trouble taking out the underline of links in outlook. If anyone has a workaround for gmail please could you help me tried everything in this thread nothing is working.
这对我有用，希望它能帮助那些仍然无法删除 Outlook 中链接下划线的人。如果有人有 gmail 的解决方法，请您帮我尝试此线程中的所有内容，但没有任何效果。
Thanks
谢谢
回答by Steven Collins
I added both declarations on the a href which worked in outlook and gmail apps. outlook ignores the !important and gmail needs it. Web versions of email work with both/either.
我在 Outlook 和 Gmail 应用程序中的 a href 上添加了两个声明。Outlook 忽略了 !important 并且 gmail 需要它。电子邮件的 Web 版本适用于两者。
text-decoration: none !important; text-decoration: none;
回答by Ricardo
I think that if you put a span style after the <a>tag with text-decoration:noneit will work in the majority of the browsers / email clients.
我认为，如果您在<a>带有text-decoration:none它的标签之后放置一个跨度样式，它将在大多数浏览器/电子邮件客户端中工作。
As in:
如：
<a href="" style="text-decoration:underline">
<span style="color:#0b92ce; text-decoration:none">BANANA</span>
</a>
回答by Jeffrey Neo
To completely "hide" underline for <a>in both mail application and web browser, can do the following tricky way.
要<a>在邮件应用程序和 Web 浏览器中完全“隐藏”下划线，可以执行以下棘手的方法。
<a href="..."><div style="background-color:red;">
<span style="color:red; text-decoration:underline;"><span style="color:white;">BUTTON</span></span>
</div></a>
Color in 1st
<span>is the one you don't need, MUSTset as same as your background color. (red in here)Color in 2nd
<span>is the one for your button text. (white in here)
1st
<span>中的颜色是您不需要的颜色，必须设置为与您的背景颜色相同。（此处为红色）第二个颜色
<span>是按钮文本的颜色。（此处为白色）
回答by Dr. Aaron Dishno
Text decoration none was not working for me, then i found an email in outlook that did not have the line and checked the code:
文本修饰 none 对我不起作用，然后我在 Outlook 中找到了一封没有该行的电子邮件并检查了代码：
<span style='font-size: 12px; font-family: "Arial","Verdana", "sans-serif"; color: black; text-decoration-line: none;'>
<a href="http://www.test.com" style='font-size: 9.0pt; color: #C69E29; text-decoration: none;'><span>www.test.com</span></a>
</span>
This one is working for me.
这个对我有用。
回答by Tom Leppens
I used a combination of not showing links in google, adding links for mso (outlook) and the shy tag, to keep the looks and feels for my company. Some code may be redundant (for my company the looks where more important then the be clickable part. (it felt like a jigsaw, as every change brakes something else)
我使用了在 google 中不显示链接、为 mso (outlook) 添加链接和害羞标签的组合，以保持我公司的外观和感觉。一些代码可能是多余的（对于我的公司来说，外观比可点击部分更重要。（感觉就像一个拼图，因为每一个变化都会阻碍其他东西）
<td style="color:rgb(69, 54, 53)">
<!--[if gte mso 9]>
<a href="http://www.immothekerfinotheker.be" style="text-decoration:none;">
<span style="text-decoration:none;">
<![endif]-->
www­.­immothekerfinotheker­.­be
<!--[if gte mso 9]>
</a>
</span>
<![endif]-->
</td>
Hope this helps someone
希望这有助于某人
