今天从 Outlook 向 Gmail 发送邮件时遇到了一个新问题。问题是超链接元素显示为下划线。 我在下面尝试过。
方法一：
<td width="500px" align="center" style=" text-align: left; font-size:1.2em; font-family:Candara; color: #FFFFFF;">
<a href="mailto:[email protected] /cdn-cgi/l/email-protection" style="color:#fff;text-decoration:none;" target="_blank">[email protected] /cdn-cgi/l/email-protection</a>
</td>
方法2：
<a href="mailto:[email protected] /cdn-cgi/l/email-protection" style="color:#fff;text-decoration:none !important;" target="_blank">[email protected] /cdn-cgi/l/email-protection</a>
方法三：
a {text-decoration: none !important; color: #000; cursor: text;}
这段代码在浏览器、outlook中工作正常，问题出在Gmail邮箱中。因为Gmail在超链接标签后动态附加span标签。
我在这里附上了视频参考：
http://recordit.co/OGlkkBiXGX http://recordit.co/OGlkkBiXGX
鉴于： text-decoration none 它不会被 gmail 框采纳，因为在添加了 span 标签内的标签后。
完整代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>mailtest</title>
</head>
<body style="margin:0; padding:0;">
<table width="582" border="0" cellspacing="0" cellpadding="0" align="center" style="background:black;">
<tr>
<td width="500px" align="center" style=" text-align: left; font-size:1.2em; font-family:Candara; color: #FFFFFF;">
<img style="margin-left:10px;" src="http://codestrz.com/Content/mail/envelope.png" alt="" border="0" height="18" width="18"/>
<a href="mailto:[email protected] /cdn-cgi/l/email-protection" style="color:#fff;text-decoration:none" target="_blank">[email protected] /cdn-cgi/l/email-protection</a>
</td>
</tr>
</table>
</body>
</html>
我尝试过这个简单的标签：
<p style="color:white;"> EXTRANET.EXAMPLE.COM</p>
后来尝试了没有链接的简单 p 标签，
Output in outlook 2013
:
[![enter code here][1]][1]
gmail output
Insert ;在你的样式中使用 text-decoration:none 之后，因为在某些情况下 html 无法无休止地读取正确的 css。