Question

我想发送使用HTML和CSS格式的自定义电子邮件，因此基本上我的模板如下所示：

<html>
    <head>
        <link rel='stylesheet' href='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css'>
        <script src='https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js'></script>
        <script src='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js'></script>
        <style>
            .first {background-color: green; color: black;}
            .second{background-color: red; color: white;} 
        </style>
    </head>
    <body>
        <div class='col-sm-8 first'> Hello <%= typeof name!='undefined' ? name : 'user' %> !</div>
        <div class='col-sm-4 second'> You have been registered! </div>
    </body>
</html>

我正在使用ejs解析模板。当我从Thunderbird或Outlook中打开电子邮件时，一切看起来都很好，但是当我使用Spark打开电子邮件时，它仅显示纯文本（Hello David！您已注册！）。 Spark可以完美显示来自其他服务的格式化电子邮件，但无法显示我发送的电子邮件。

有什么办法可以避免电子邮件客户端中的这种行为或在Spark中解决此问题？

Answer 1

您需要以与普通网站不同的方式构建HTML电子邮件。最佳实践是使用基于表的布局和内联样式，这是因为电子邮件客户端的工作方式不像浏览器（例如，MS Outlook使用Word引擎呈现其内容）。 Bootstrap根本不起作用，外部样式表不受广泛支持，并且外部JS到处都会被阻止。

一些好的资源可用于学习基本布局：

https://webdesign.tutsplus.com/articles/build-an-html-email-template-from-scratch--webdesign-12770 https://emailmonks.com/blog/email-coding/step-step-guide-create-html-email/

您还可以尝试使用MJML之类的工具。它使用自己的简单语法并将其呈现为HTML电子邮件。

使用HTML和CSS发送电子邮件

1 个答案: