如何在从Outlook发送电子邮件模板时，在Gmail中去除超链接下划线

Question

如何在从Outlook发送电子邮件模板时，在Gmail中去除超链接下划线

6

今天我在使用outlook发送邮件到Gmail时，遇到了一个新问题。问题是超链接元素显示为下划线。我尝试了以下方法: 方法1:

 <td  width="500px" align="center" style=" text-align: left; font-size:1.2em; font-family:Candara; color: #FFFFFF;">
             <a href="mailto:info@example.com" style="color:#fff;text-decoration:none;" target="_blank">info@xxx.com</a>      
    </td>

方法2：

<a href="mailto:info@example.com" style="color:#fff;text-decoration:none !important;" target="_blank">info@ccc.com</a>

方法三：

  a {text-decoration: none !important; color: #000; cursor: text;}

这段代码在浏览器和Outlook中正常工作，问题出现在Gmail邮箱上。因为Gmail会动态添加span标签到超链接标签之后。

这里附上一个视频参考：

http://recordit.co/OGlkkBiXGX

给定：text-decoration none由于在span标签内添加了a标签后而无法被Gmail邮箱接受。

完整代码：

<!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:info@example.com" style="color:#fff;text-decoration:none" target="_blank">info@xxx.com</a>      
                </td>
            </tr>
        </table>
    </body>
</html>

我尝试使用这个简单的标签：

    <p style="color:white;"> EXTRANET.EXAMPLE.COM</p>

尝试了一下不带链接的简单p标签，

在Outlook 2013中输出结果如下:

[![enter code here][1]][1]

Gmail输出

- Mohamed Sahir

你能展示一下追加了<span>标签后的代码是什么样子吗？ - Daniel_ZA

请仔细观看上面提到的视频，它会清晰地展示。 - Mohamed Sahir

你的 Outlook 版本是什么？ - Narendhran

@Narendhran Outlook 2013 - Mohamed Sahir

<div class="myClass"> <a href="mailto:info@example.com"> info@xxx.com<span class=myClass1> info@ccc.com </span></a> </div> 然后在你的CSS中，.myClass，.myClass1{ text-decoration: none; color: #FFFFFF; } - Narendhran

@narendran 我已经尝试过了，现在再试一下，请查看这里的屏幕录像 http://recordit.co/iAD6BPK7pW - Mohamed Sahir

2个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- sonam · Answer 1

在你的样式中，在text-decoration:none之后插入;，因为在某些情况下，HTML无法正确读取没有结尾的CSS。

- Narendhran · Answer 2

试试这个

 <a href='yourLink' bgcolor="#000000">yourLinkHere</a>

或者

<a href="yourLink" style="color:#CCCCCC; text-decoration:none;"><color="#CCCCCC">yourLink</font></a>

对于2007年以上版本的Outlook，

按下CTRL+SHIFT+ALT+S
在样式和格式窗格中右键单击超链接条目，选择修改
更改超链接的字体设置。（去掉下划线）

就这样， 要为所有新建的邮件更改此设置

启用选项（单选按钮）：基于此模板创建新文档