6

我开发了一个自定义电子邮件模板，它使用媒体查询来定位小于 480 像素的设备。电子邮件在每个电子邮件客户端和平台（Gmail、Yahoo!、Hotmail、Apple Mail、Thunderbird、Outlook 2003 等）中的外观和显示都很完美，Outlook 2007 到 2013 除外。

Outlook 2007 到 2013 奇怪地选择了媒体查询并使用给定的 css 声明设置电子邮件的样式。当我删除媒体查询时，它会完美呈现。知道如何让 Outlook 忽略媒体查询吗？

下面是正在使用的媒体查询以及 jsFiddle 链接。将 max-device-width 更改为 max-width 以查看实际的媒体查询。

jsFiddle：http: //jsfiddle.net/danimalnelson/uQ7kg/

@media only screen and (max-device-width: 480px) {
4

4 回答 4

14

您可以强制 Microsoft 忽略部分代码：

<!--[!if gte mso 9]><!-->
 // This will be ignored by Outlook 2007
<![endif]-->

<!--[!if gte mso 15]><!-->
 // This will be ignored by Outlook 2013
<![endif]-->

<!--[if !mso]><!-->
 // This will be ignored by all Microsoft Outlook
<!--<![endif]-->

这是Outlook 版本号

于 2013-05-31T16:32:36.713 回答
1

我一直相信：

<!--[!if gte mso 9]>
 // This WILL be rendered by Outlook 2007 as 'gte' means greater than or equal to
<![endif]-->

<!--[!if gt mso 9]>
     // This WON'T be rendered by Outlook 2007 as 'gt' means greater than
<![endif]-->

约翰。您是否有指向您在哪里找到有关哪个 mso 编号与哪个 Outlook 版本相关的资源的链接？

某处是否有 Microsoft 页面，其中包含明确的 mso 编号列表？

到目前为止，我喜欢的最有用的资源是这个德语维基页面： http ://de.wikipedia.org/wiki/Conditional_Comments

于 2013-09-04T09:12:02.253 回答
1

如果你想隐藏使用这个

<!--[if !mso]><!-->
// This will be ignored by all Microsoft Outlook give display:none
<!--<![endif]-->

在媒体查询中写display:block;

于 2018-04-02T12:33:05.753 回答
-1

听从我的建议，不要重新发明轮子，使用一些已经测试过很多次的入门模板，并且已经修复了许多错误，比如Antwort

于 2013-05-31T16:16:01.440 回答