Настройка background-blend-mode и background-color не работает в электронной почте HTML - PullRequest
0 голосов
/ 02 октября 2018

Я пытаюсь создать электронное письмо и установить фоновое изображение на <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-странице, однако при отправке этого сообщения по электронной почте в настольный веб-клиент Gmail / приложение «Входящие» в Android / приложение Gmail в Android фон исчезает.

Из чегоЯ проверил, все свойства, которые я установил, совместимы с клиентами, которых я упомянул.

Есть ли другой способ сделать это в электронных письмах?

Ответы [ 2 ]

0 голосов
/ 02 октября 2018

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.Однако вы можете получить обходной путь для работы с Outlook, используя VML.

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

Поскольку вы не публикуете пример кода того, что вы пытаетесь сделать,просто небольшой фрагмент, трудно сделать предложения о лучших способах получения того же эффекта.

Удачи.

0 голосов
/ 02 октября 2018

При разработке шаблонов электронной почты вы должны работать так, как если бы вы создавали веб-сайт в середине 90-х годов.Многие вещи не работают.На самом деле, есть еще кое-что, что не работает, а затем то, что работает.

Удобным инструментом является caniuse.email .

...