Mailchimp模板中的圆角 - CSS或基于图像

Question

我正在为Mailchimp创建一个电子邮件模板.我已经下载了一个模板,现在按照要求放置我的内容(我知道使用Mailchimp模板语言).我的问题是我必须使用圆角并使用基于图像的圆角.

当我在Mailchimp可视化编辑器中编辑表格时,基于图像的圆角会破碎,不再有效.

我应该使用CSS还是基于图像的圆角？请给我任何建议.

*编辑:总是使用图像这是我得到的最佳解决方案..

Answer 1

Mailchimp在其电子邮件蓝图模板中使用基于CSS的圆角.这是来自CampaignMonitor的图表,显示了一些电子邮件客户端border-radius(-moz和-webkit前缀)将会/将无法使用.

基于CSS的圆角在每个电子邮件客户端都不起作用,但在不支持border-radius属性的客户端中会优雅地失败.当阅读器没有启用图像时,基于图像的圆角将不会显示,而且正如您所经历的那样,根据模板的设置方式,在MailChimp可视化编辑器中维护基于图像的圆角可能会很困难.

我的建议是基于CSS的圆角,使用前缀覆盖最广泛的电子邮件客户端:

border-radius: 4px;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;

不支持基于CSS的圆角的浏览器/客户端将看到方角.这肯定是一种权衡,每种方法都有它的优点/缺点.如果可以查看列表中可能有助于做出决定的用户代理.如果您的列表包含大量支持基于CSS的圆角的客户端,而不是基于CSS的圆角. (3认同)

Answer 2

使用图像，它们 100% 支持。这里是如何正确执行此操作的示例。

您需要上传要由 Mailchimp 或您自己的 URL 托管的角落图像。如果是，Mailchimp 可能会重新格式化您的代码。不确定它是否是所见即所得，因为我不是 Mailchimp 用户，但如果是这种情况，您可以随时编辑输出代码以放回图像 URL。