HTML电子邮件模板Mailchimp，Outlook和Gmail中的CSS问题

问题描述：

我开发了HTML电子邮件模板并导入到Mailchimp。它在测试模式下工作完美。当我发送它时，Gmail，Outlook和Windows Mail在加载CSS样式时遇到问题。它只显示HTML。HTML电子邮件模板Mailchimp，Outlook和Gmail中的CSS问题

然后我试着用没有链接CSS的表格进行开发，在Mailchimp测试和Gmail，Outlook和Windows Mail问题中再次完美。因为甚至没有加载表格的STYLE属性。

请帮忙。

<!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>Email Design</title> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/> 
</head> 
    <body style="margin: 0; padding: 0;"> 
<table align="center" border="1" cellpadding="0" cellspacing="0" width="600" background="img/beton.jpg" style=""> 
<tr> 
    <td > 
<img src="img/logo.png" alt="Creating Email Magic" width="160" height=auto align="right" style="padding: 49px 60px; 0 0; left:548px; display: block;" /> 
<a href="facebook.com"><img src="img/facebook.png" alt="Creating Email Magic" width="50" height=auto align="right" style="padding: 39px 0px 0 0px; 0 0; left:548px; display: block;" /></a> 
     <img src="img/newsletter_h1.png" alt="Creating Email Magic" width="342" height=auto align="left" style="padding: 0px 00px; 0 0; display: block;" /> 


</td> 
</tr> 
<tr> 
    <td > 
    Row 2 
    </td> 
<tr> 
    <td > 
    Row 3 
    </td> 
</tr> 
</table> 

     <div></div> 
</body> 




</html>

你可以发布你的代码吗？ – 2016-11-10 10:39:17

电子邮件与网页不一样。电子邮件就像构建表格HTML4网页一样。这里是电子邮件客户端支持的CSS指南：https：//www.campaignmonitor.com/css/ - 还有它值得用类似电子邮件的方式测试你的电子邮件：https：//www.emailonacid.com/ – Andrew

有编码电子邮件模板时有很多限制，您应该查看关于电子邮件客户端支持> https://templates.mailchimp.com/resources/email-client-css-support/的mailchimps文档。您还应该重置填充/页边距所有你的的，也避免使用简短的CSS。 –

答

也许问题在邮件中的标题类型。请按照以下方式检查您的标题。

// Always set content-type when sending HTML email 
$headers = "MIME-Version: 1.0" . "\r\n"; 
$headers .= "Content-type:text/html;charset=UTF-8" . "\r\n";

HTML电子邮件模板Mailchimp，Outlook和Gmail中的CSS问题

相关推荐