用媒体查询替换图像响应电子邮件

Question

我试图编写响应电子邮件，以便当用户的分辨率低于480px时，我们隐藏大图像并用较小的背景图像替换它们。但是，事实证明，背景图像不会显示在移动设备或桌面上。那么在响应电子邮件中替换大图像以更小图像的方法是什么？

谢谢！

Answer 1

实际上，如果可能的话，您的设计仍然需要“工作”且缺少背景图像。

Outlook（我的意思是桌面应用程序而不是Outlook.com，Hotmail的替代品）几乎是最糟糕的电子邮件客户端，它支持各种基本的HTML/CSS功能 - Campaign Monitor CSS compatibility chart - 以及更现代的像媒体查询的东西 - 这是因为Outlook 2007,2010甚至2013版本都使用微软Word渲染引擎...

有is a VML-based background image hack但它是非常可怕的，不保证工作 - 我不会推荐。

很明显，您需要考虑电子邮件广告系列的受众群体，但是除非您有客户需要Outlook支持（尽管您可以尝试解释这种情况），但我更感觉Outlook是'点击此处if这封电子邮件在您的浏览器中无法正确显示“您的邮件顶部的链接是为了 - 我会检查正文文本在Outlook中可读，但坦率地说，不要担心太多其他问题，请专注于在mobile clients that do allow media-queries中正确填写。