Outlook 和 VML 不同的视图答案

【问题标题】：Outlook & VML different viewOutlook 和 VML 不同的视图
【发布时间】：2020-09-28 15:27:49
【问题描述】：

根本问题是显示与 MSO 兼容的漂亮按钮。当我使用 VML 时，它可以在一台电脑上完美运行，而在另一台电脑上却无法正常工作。关键是两台电脑的环境是一样的

Win 10 - Microsoft Outlook (16005.13110.41006.0) 按钮源代码为

    <!--[if mso]>
    <v:rect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" href="http://google.com" style="line-height:28px; height:28px;width:135px; display: inline-block;" stroked="False" fillcolor="#468fb0">
        <center style="color: #ffffff; font-size: 11px;">
            CENTER
        </center>
    </v:rect>
    <![endif]-->

在我的看起来不错

在其他电脑上

所以

两个维度的尺寸都较小
里面没有文字
按钮可点击

我尝试了不同的 VML/HTML 标记组合，但始终相同 - 宽度和高度被忽略，内部文本完全丢失

如果将电子邮件保存为 EML 文件并进行比较 - 相同有什么建议可以触发这种样式吗？

顺便说一句，其他链接和样式正常工作。谢谢

【问题讨论】：

标签： email outlook ms-office html-email vml

【解决方案1】：

我注意到 Campaign Monitor 的“bullet proof button”在<center> 之前有这个<w:anchorlock/>，这似乎是一种阻止锚点（链接）被修改的内部机制。也许就是这样？

即

<!--[if mso]>
<v:rect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" href="http://google.com" style="line-height:28px; height:28px;width:135px; display: inline-block;" stroked="False" fillcolor="#468fb0">
<w:anchorlock/>
    <center style="color: #ffffff; font-size: 11px;">
        CENTER
    </center>
</v:rect>
<![endif]-->

【讨论】：

伤心，但没有效果
我不确定你是否可以拥有display: inline-block; - 尝试删除它。 Outlook 通常不考虑显示更改。

【解决方案2】：

好吧，这很奇怪，但是问题出在像素上（可能与屏幕分辨率有关？） px 的每个尺寸都较小。解决了将大小替换为pt

【讨论】：

这与我所说的放大倍数有关。你的电脑可能有 100%，其他人可能有 125 或 150%。点可以解决它。