使用Rails Mailer Previews / Letter Openeer测试线性梯度的CSS回退

Question

我正在尝试为我们的电子邮件模板设置一个后备背景色：-

<a href="/" style="
   background-image: linear-gradient(134.72deg, #3023AE 0%, #C86DD7 100%)" 
   background-color: #7c47c2;
</a>

除了一些Windows平台上的MS Outlook之外，上面的方法在大多数浏览器/客户端上都有效-发生的情况是背景是空白的，没有应用颜色。

我现在已经将顺序切换到下面：-

<a href="/" style="
   background-color: #7c47c2;
   background-image: linear-gradient(134.72deg, #3023AE 0%, #C86DD7 100%)" 
</a>

这在以前被破坏的客户端上工作，但这里发生的是背景颜色现在覆盖了永远不会显示的线性渐变。

当我检查电子邮件时，背景图像属性甚至不存在于电子邮件源中。

我的问题是-当我以Rails Mailer Preview的形式查看它时，这个属性会消失到哪里？

Answer 1

这是因为linear-background不是background-image的属性。它应该是background，而不是background-image，然后它就会工作。

您应该将背景颜色放在第一位，因为您希望渐变覆盖它(如果支持)。不支持它的电子邮件客户端将简单地删除渐变部分。