超文本标记语言电子邮件-适合表格单元格中的图像
我有一个表,其中有三个td
,每个表中都需要有图像。td
的宽度和高度是固定的,但图像大小可以改变。目标是在不扭曲单元格或图像本身的情况下对图像进行拟合。无法使用background-image
属性(糟糕透了,我知道!)。代码如下:
<table cellpadding="2" cellspacing="2" width="600">
<tr>
<td width="190" height="190" align="center">
<img src="https://images.imgbox.com/fb/e0/53ItYqFd_o.jpg" style="display: block; width: 100%; height:auto;" />
</td>
<td width="190" height="190" align="center">
<img src="https://images.imgbox.com/13/e7/pM2IjFYr_o.jpg" style="display: block; width: 100%; height:auto;" />
</td>
<td width="190" height="190" align="center">
<img src="https://images.imgbox.com/13/e7/pM2IjFYr_o.jpg" style="display: block; width: 100%; height:100%;" />
</td>
</tr>
</table>
我在三个单元格中尝试了三种不同的样式--没有一种给我图像调整大小的结果。如果有任何帮助,我很感激。谢谢。
解决方案
尝试使用-max-Width:100%和max-Height:100%作为图像样式。这将最大限度地将较大的值(高度或宽度)放大到单元格的witdh(或高度),而不会拉伸图像。
编辑:这是新功能...添加代码片段。由于您的样式是内联样式,因此我将其留在原处。
数据-lang="js"数据-隐藏="假"数据-控制台="真"数据-巴贝尔="假"><table cellpadding="2" cellspacing="2" width="600">
<tr>
<td width="190" height="190" align="center">
<img src="https://images.imgbox.com/fb/e0/53ItYqFd_o.jpg" style="display: block; max-width: 100%; max-height:100%;" />
</td>
<td width="190" height="190" align="center">
<img src="https://images.imgbox.com/13/e7/pM2IjFYr_o.jpg" style="display: block; max-width: 100%; max-height:100%;" />
</td>
<td width="190" height="190" align="center">
<img src="https://images.imgbox.com/13/e7/pM2IjFYr_o.jpg" style="display: block; max-width: 100%; max-height:100%%;" />
</td>
</tr>
</table>
相关文章