背景大小:HTML电子邮件中的封面效果

时间:2014-07-04 12:03:28

标签: html css css3 html-email

我正在为我的照片社区网站制作简报。在时事通讯中,我希望有一个图像网格。这是电子邮件客户端中未完成的渲染。正如您所看到的,它有问题,这只是为了说明我正在尝试构建的内容。

enter image description here

现实中的图像文件大约是电子邮件中所示分辨率的两倍。此外,它们可以是任何纵横比和方向。我想要实现的目标:

  • 将所有图像强制为200 x 200px单元格
  • 不要扭曲图像,必须保持纵横比
  • 必须始终在水平和垂直方向填充单元格
  • 背景大小应该集中在
  • 元素必须是可点击的,导致该特定照片
  • 应该是健壮的,适用于最流行的电子邮件客户端

在普通网络技术(与电子邮件中的HTML相对)中,这是将图像容器设置为固定尺寸并使用background-size:cover的问题。我已经了解了许多HTML电子邮件限制,但我仍然试图找到这种或那种方式。

我真的在一个不可能的任务吗?

到目前为止我尝试过:

  • 将图像设置为包围img标记的a的背景。通过一些调整可以得出合理的结果,但是居中是一个问题,outlook.com根本不显示图像。
  • 使用带有“a”的普通img标签并尝试控制图像及其包装上的最大宽度和高度。这里也是主要问题

我真的希望可以这样或那样做(不是在我的情况下服务器端调整大小不是一个选项)。

1 个答案:

答案 0 :(得分:2)

由于这是在电子邮件客户端上,因此您无法使用任何脚本语言。这意味着在客户端无法操纵图像。

在创建电子邮件之前,您必须手动为图片创建缩略图或制作一些创建缩略图服务器端的代码。

在不知道如何创建电子邮件的情况下,我可以告诉您这一点。