时间戳

首页 > 解决方案 > Outlook 的 VML 背景图像中带有圆角的头像

outlook - Outlook 的 VML 背景图像中带有圆角的头像

问题描述

我正在处理一些电子邮件模板（上帝保佑），我正在尝试弄清楚如何在相关联系人旁边的表格中显示圆形头像。

目前我正在使用此代码。使用 av:fill 应用背景图像，使用 av:rect 应用边框半径。但是我没有任何成功。

一个要点是我不希望此元素中包含任何内容。它的存在是为了提供头像图像，所以我一直在努力寻找任何可以帮助我的东西。

非常感谢帮助！

<table>
    <td background="https://picsum.photos/32" width="32" height="32" valign="top" style="border-radius: 50%">
      <!--[if gte mso 9]>
      <v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" arcsize="50%" stroke="false" style="width:32px;height:32px;">
        <v:fill type="tile" src="https://picsum.photos/32" arcsize="50%" color="#7bceeb" />
      </v:rect>
      <![endif]-->
    </td>
</table>

标签： outlookhtml-emailvml

解决方案

我发现解决方案效果很好。使用 a<v:oval>给出形状并<v:fill>给出图像。

虽然我发现我必须将椭圆上的笔画设置为 false，但它似乎默认为打开。

<td width="32" style="margin: 0; padding: 0;">
   <!--[if (gte mso 9)|(IE)]>
      <v:oval xmlns:v="urn:schemas-microsoft-com:vml" fill="true" style='width:32px;height:32px' stroke="false">
         <v:fill type="tile" src="[URL]" />
      </v:oval>
   <![endif]-->
   <!--[if !mso]>-->
      <img style="border-radius: 16px;" width="32" height="32" src="[URL]" />
   <!--<![endif]-->
</td>

<img>然后使用条件语句，我可以向 Outlook 提供 VML 形状，并向支持边界半径的其他所有人提供常规元素。

（根据caniemail.com ，基本上除了 Outlook 之外的任何内容）

推荐阅读