时间戳

首页 > 解决方案 > 设置背景混合模式和背景颜色在 HTML 电子邮件中不起作用

css - 设置背景混合模式和背景颜色在 HTML 电子邮件中不起作用

问题描述

我正在尝试创建一封电子邮件并在<td>不透明度较低的情况下设置背景图像。
我来到的是： 

<td dir="rtl" align="center" style="width:100% border: 0px; background-blend-mode: lighten; background-color: rgba(255, 255, 255, 0.8); background-image:url('image_url');background-repeat:no-repeat;background-position: 50% 50%;background-size:auto; vertical-align: middle;" colspan="2">

当我在我创建的 HTML 页面上使用它时效果很好，但是，当我将其作为电子邮件发送到 Android 上的 Gmail 桌面网络客户端/收件箱应用程序/Android 上的 Gmail 应用程序时，背景消失了。

根据我的检查，我设置的所有属性都与我提到的客户端兼容。

在电子邮件中还有其他方法可以做到这一点吗？

标签： csshtml-email

解决方案

background-blend-mode适用于 IOS 设备、传统 Gmail，但不适用于很多移动客户端或 Outlook。

https://www.campaignmonitor.com/css/color-background/background-blend-mode/

查看这篇文章，看看是否有另一种可能有帮助的技术，但没有什么通用的方法可以使用。 https://www.emailonacid.com/blog/article/uncategorized/css-animations-part-1/

rgba-color不适用于 Yahoo 或 Outlook。

https://www.campaignmonitor.com/css/color-background/rgba-colors/

positioning不适用于大多数电子邮件客户端。

background-image根本不适用于 Outlook 或某些 Android 客户端。但是，您可以获得使用 VML 与 Outlook 一起工作的变通方法。

https://www.campaignmonitor.com/css/color-background/background-image/

由于您并没有真正发布您正在尝试做什么的代码示例，只是一个小片段，因此很难就获得相同效果的更好方法提出建议。

祝你好运。

推荐阅读