0

我们正在改用 Mailjet API 来发送电子邮件。我们现在面临的一个问题：我们正在使用 apache 速度模板作为 html 正文，我们在 html 的 src 标记中提供图像 url。但是由于明显的原因（图像大小等），我们为台式机、移动设备/ipad 提供了不同的图像

我们如何确定何时在客户端设备上呈现电子邮件时要呈现哪个横幅。mailjet 是否有任何切换图像功能？

提前致谢。

4

1 回答 1

1

如果您需要交换图像，而不仅仅是缩小图像 ( style="width:100%;height:auto;")，则响应方式如下：

将此添加到您的<head>部分：

<style>
    @media screen and (max-width:620px) {
        .image_mobile {
            display:block!important; max-height: none !important; max-width:none !important; line-height: 1.5 !important;width:100%!important; height:auto!important;
        }
        .hide {
            display:none!important; width:0px!important; height: 0px!important; overflow:hidden!important; line-height: 0px!important; font-size:0px!important;
        }
    }
</style>

并将其放入您的内容中：

<img border="0" width="xxx" src="xxx" alt="xxx" style="display:block; outline:none; text-decoration:none; -ms-interpolation-mode: bicubic;width:100%;height:auto;" class="hide">
<!--[if mso]><!-->
<div style="display:none; font-size:0; line-height:0;  max-height: 0; max-width: 0; width:0;" class="image_mobile">
    <img border="0" width="xxx" src="xxx" alt="xxx" style="display:none; font-size:0; line-height:0;max-height: 0; max-width: 0; width:0; -ms-interpolation-mode: bicubic;" class="image_mobile">
</div>
<!--<![endif]-->

默认情况下会显示第一张图片（台式机；网络邮件；不支持@media 的人）。但是大多数移动应用程序都支持@media，因此会隐藏第一张图片并显示第二张图片。

（因此，它不是 Mailjet 的功能，而是您的代码）

于 2020-05-18T01:42:17.617 回答