带有 Outlook 条件 VML 的 Windows 10 邮件应用程序答案

【问题标题】：Windows 10 Mail App with Outlook Conditional VML带有 Outlook 条件 VML 的 Windows 10 邮件应用程序
【发布时间】：2016-03-24 06:54:36
【问题描述】：

这个有点晦涩，但我希望有人可以提供解决方案。

我正在创建一个带有全宽标题栏的电子邮件模板。经过大量的修改后，我已经能够在大多数电子邮件客户端中很好地工作，使用背景图像样式和条件 VML（用于 Outlook 客户端）的组合。

问题是 Windows 10 邮件应用程序响应 Outlook 条件语句，但无法正确呈现 VML。这会导致一个丑陋的损坏的图像图标，并显示“无法显示此图片”消息。

这是我的条件 VML 块...

<!--[if gte mso 9]>
    <v:rect stroke="f" fill="t" style="mso-width-percent: 980; height: 200; position: absolute; z-index:-1; mso-position-horizontal: left">
<v:fill type="tile" src="/Content/images/my_background.gif" color="#f4f4f4" />
    </v:rect>
<![endif]-->

所以我需要的是让 Windows 10 Mail 正确显示 VML，或者完全忽略该部分。该设计在没有标题栏的情况下可以正常工作，但我只是不希望它显示损坏的图像图标。

【问题讨论】：

标签： email outlook windows-10 vml

【解决方案1】：

部分解决方案 A

修改你的条件为

<!--[if (gte mso 9)&(lte mso 15)]>

以及要在 Outlook 2013 中显示但不在 Windows 10 邮件应用程序中显示的 VML 块。但是，它也将不显示 Outlook 2016。他们都认为他们是 mso=16。（最后两句话尚未验证。）

部分解决方案 B

https://litmus.com/community/discussions/4176-windows-10-mail-bulletproof-background-buttons-broken

【讨论】：

【解决方案2】：

我知道这是个老问题，但它可能对仍在为 web、windows Outlook 和 windows 邮件苦苦挣扎的人有用。

我找到了一种专门从 Windows Outlook 和 Windows 10 邮件应用程序隐藏元素的方法：

<span style="mso-element:field-begin;"></span>
 Content to hide from Outlook 
<span style="mso-element:field-end;"></span>

引用这个伟大的blog。

您还可以将所有 Outlook 应用程序（移动、网络、桌面）定位为：

<!--[if mso]> 
    <div> Your content that you want visible </div>            
<![endif]-->

您还可以使用其他条件反转它并针对特定版本，类似：

<!--[if !mso]> Everything not mso (outlook or windows mail) <![endif]-->
<!--[if gte mso 16]> All mso versions that are greater than 16 <![endif]-->

更多关于这个link。

至于在桌面/Windows 版本的 Outlook（邮件应用和 Outlook ms）中显示背景图像，您可以使用 VML 以及更多相关信息，您可以找到 here.

【讨论】：