MailChimp 预览覆盖链接样式答案

【问题标题】：MailChimp preview overrides link stylesMailChimp 预览覆盖链接样式
【发布时间】：2016-03-27 10:49:31
【问题描述】：

我在为 MailChimp 创建自定义模板时遇到了一个问题 - 当编辑电子邮件内容中的链接时，MailChimp 会覆盖它们的样式。这是模板的一部分，

<a mc:edit="cta_link" target="_blank" href="*|CUSTOM_URL|*" style="font-family: 'Helvetica', 'Arial', sans-serif !important; font-size: 11px; color: #000000 !important; border-bottom: 1px solid #000000 !important; text-transform: uppercase !important; padding-bottom: 1px;">Read more</a>

如您所见，我还在某些样式中添加了 !important 规则，以尝试避免任何覆盖，但没有任何效果。我已经在静态示例 href src 和 MailChimp 自定义 url 变量之间切换，似乎没有任何区别。更新链接后，字体更改为默认的 Times 字体。我有什么遗漏吗？

【问题讨论】：

您是否有完整转储了覆盖样式的邮件黑猩猩页面？有可能邮件黑猩猩样式也附加了 !important ，此时更重要的是首先实现哪种样式。如果您使用 chrome，您可以检查元素并查看正在使用哪些样式以及正在覆盖哪些样式。
我无法复制此错误。我把它放在一个自定义模板中，它的行为符合预期。你能给自己发一封测试邮件并发布 html 内容吗？
这里是完整的模板代码。如果你能看一下，不胜感激。 pastebin.com/cuZCmrhz

标签： templates editor mailchimp

【解决方案1】：

4 年后，它仍在发生。

应用到链接元素的样式会被全局链接样式覆盖。

我的解决方案：在链接中插入一个 span 标签。

<a mc:edit="cta_link" target="_blank" href="*|CUSTOM_URL|*"><span style="font-family: 'Helvetica', 'Arial', sans-serif !important; font-size: 11px; color: #000000 !important; border-bottom: 1px solid #000000 !important; text-transform: uppercase !important; padding-bottom: 1px;">Read more</a>

【讨论】：