Question

我正在尝试使用表格创建基于html的电子邮件签名。

它绝对可以在html中工作，当我复制并粘贴到gmail中时可以使用，但是当我复制到Outlook中时，CSS中断了。我在这里做错了吗？

<table style="width: 500px; font-size: 12pt; font-family: Arial,sans-serif; line-height:normal;" cellpadding="0" cellspacing="0">
<tbody>
 <tr> 
  <td style="width:86px; vertical-align:middle;" valign="middle">
   <a href="#" target="_blank"><img border="0" alt="Logo" height="auto" width="148" style="width:148px; height:auto; border:0;" src="https://i.imgur.com/1HlZfl8.png"></a>
   
  </td>
  

  <td style="width:45px; text-align:center; vertical-align:middle;" valign="middle">
   <div style="margin-left:15px"><img src="https://i.imgur.com/mNNR1Ga.png"></div>
  </td>
  <td style="width:500px; vertical-align:middle;" valign="middle">
   <table cellpadding="0" cellspacing="0" width="100%">
   <tbody>
    <tr>
     <td style="font-size:12pt; font-family: Arial, sans-serif; color: #3d3c3f; padding-bottom:3px;"><span style="font-weight: bold; font-family: Arial, sans-serif; color:#3c3c3b;">Jessica Smith</span>
      <span style="font-size:9pt; font-family: Arial, sans-serif; color:#3c3c3b;"> | CEO/Founder</span></td>
    </tr>
    <tr>
     <td style="font-size:9pt; font-family: Arial, sans-serif; color: #9b9b9b; padding-bottom:1px;"><span style="font-family: Arial, sans-serif; color:#3c3c3b;"><div style="font-weight:bold; display: inline-block; width: 15px;">t </div>(07) 3281 0000</span><span style="font-family: Arial, sans-serif; color:#3c3c3b"></span><span style="font-family: Arial, sans-serif; color:#3c3c3b; margin-left:10px;"><div style="font-weight:bold; display: inline-block; width: 15px;">f</div>(07) 3281 0000</span>
     </td>
    </tr>       
    <tr>
     <td width="20px" style="font-size:9pt; font-family: Arial, sans-serif; color: #9b9b9b; padding-bottom:1px;"><span style="font-family: Arial, sans-serif; color:#3c3c3b; "><div style="font-weight:bold; display: inline-block; width: 15px;">e </div><a href="#" style="color: #006f71;">info@domainnamehere.com.au</a></span>
     </td>
    </tr>       
    <tr>
     <td style="font-size:9pt; font-family: Arial, sans-serif; color: #9b9b9b; padding-bottom:1px;"><span style="font-family: Arial, sans-serif; color:#3c3c3b;"><div style="font-weight:bold; display: inline-block; width: 15px;">w </div><a href="#" style="color: #006f71;">domainnamehere.com.au</a></span>
     </td>
    </tr>       
    
   </tbody>
   </table>
  </td>
 </tr>
 <tr>
  <td style="width:500px; padding-top:16px;" colspan="3" width="500">
   <a href="#" target="_blank" rel="noopener"><img border="0" alt="Banner" width="500" style="width:500px; height:auto; border:0;" src="https://i.imgur.com/NBxWjRC.png"></a>
  </td>
 </tr>  
</tbody>
</table>

Gmail Screenshot
Outlook Screenshot

不确定发生了什么。

Answer 1

电子邮件客户端不严格遵循HTML标准。典型的电子邮件客户端的查看技术不如Web浏览器最新。您需要注意这一点。 HTML代码可在您的浏览器中使用，但可能无法在电子邮件客户端上使用。

您可能需要阅读Mailchimps Article并访问this link以获取CSS Support

HTML电子邮件签名CSS在某些电子邮件客户端中不起作用

1 个答案: