html - 在电子邮件模板中将图像定位在另一个图像之上

Question

如何在任何电子邮件模板中定位元素。在我必须将一个图像放在另一个图像之上的设计中，这只有通过绝对定位或给它一个边距才能实现。据我所知，谷歌不支持任何元素的边距和定位样式。有没有其他方法可以解决这个问题..

目前看起来像这样

预期输出

Answer 1

最常用的电子邮件客户端不支持position CSS属性。 Reference .

我可以给你两个建议。

• 将较大的图像作为父元素的背景，并将另一幅图像放在子元素中 <img>标签。玩转 width , height & float父元素和子元素的属性。

  <div style="background: url(...);">
      <img src="..."/>
  </div>
  

• 或者，如果所有电子邮件的这些图像都相同，则创建一个组合这两个图像的合成图像。