Question

我正在通过Ruby on Rails和MJML框架撰写电子邮件，并且我想要包含不同的图片。目前，图像托管在S3上，我们在HTML中提供它们。其中一些是风景，有些是人像，因此应该裁剪并居中以具有相同的尺寸。

如果我在常规网络环境中，我会使用常规css methods（background-image属性）来解决它。但我也希望该电子邮件与 Outlook （至少是最后一个版本）兼容，我提到的方法isn't compatible with。

现在我正在考虑下载图片，然后使用this gem实施裁剪逻辑并将其添加为附件。但我很高兴知道任何其他选择。

Answer 1

我不知道Outlook中是否支持object-fit和object-position。我知道IE和Edge中的他们不是。

如果支持，您可以尝试。

右键单击每个标题，然后在新标签中打开以查看实际图像

.image-parent {
  width: 150px;
  height: 150px;
  overflow: hidden;
}

.image-parent>img {
  width: 100%;
  height: 100%;
  object-position: center;
  object-fit: cover;
}

<a href="http://i.share.pho.to/18d84aae_o.jpeg">Landscape</a>
<div class="image-parent">
  <img src="http://i.share.pho.to/18d84aae_o.jpeg">
</div>
<a href="http://i.share.pho.to/eb321087_o.jpeg">portrait</a>
<div class="image-parent">
  <img src="http://i.share.pho.to/eb321087_o.jpeg">
</div>
<a href="http://i.share.pho.to/57896478_o.jpeg">square</a>
<div class="image-parent">
  <img src="http://i.share.pho.to/57896478_o.jpeg">
</div>

电子邮件中的风景/肖像图像

1 个答案: