这周我了解到 html 电子邮件这一奇迹。我有一封电子邮件需要并排显示图像和一些文本。我遇到的问题是图像被垂直拉伸(stretch)，而不是高度由宽度自动设置。 这个问题只发生在outlook中。
这是正在呈现的内容:
这是组成它的代码:
<table class="container" align="center" width="640" cellpadding="0" cellspacing="0">
<tr>
<td width="256" style="width:40%; float:left; text-align:right;">
<img class="max-image" width="256" style="display:block;width:100%; height:auto;" src="https://cdn.pixabay.com/photo/2015/06/25/17/56/people-821624_1280.jpg" alt="coach picture"/>
</td>
<td width="384" style="width:60%; float:left; text-align:center;">
<table width="100%">
<tr>
<td width="10"></td>
<td>
<div style="padding-left: 10px;text-align: center;">
<p style="color:#6AA342;"><strong>Meet The Coach</strong></p>
<p>{{ coach_first_name }}</p>
<p>{{ bio }}</p>
</div>
</td>
</tr>
</table>
</td>
</tr>
</table>
到目前为止，从我在网上收集到的信息来看，当您没有明确设置图像的高度属性时，outlook 似乎并不喜欢，但我遇到的问题是该图像是动态设置的，它可能是每个电子邮件的纵横比不同，所以我无法真正设置图像的高度。
最佳答案
如果您查看以下行:
<td width="256" style="width:40%; float:left; text-align:right;">
您可能会看到 Outlook 不支持的 float:left 属性。事实上，Outlook 使用 Word 呈现 HTML 正文。
您可以在以下文章中找到支持和不支持的 HTML 元素、属性和级联样式表属性的完整列表:
关于html - 为什么 outlook 会拉长我的图像高度？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/57378213/