Question

我有一个固定高度和宽度的表格单元格。在其中我有一个可以改变大小和图像的图像。大小比。

我想让图像在表格单元格中水平和垂直对齐。此外，图像应按表格单元的大小按比例缩小。

这是电子邮件模板的一部分，因此我没有现代的CSS支持，因此我不能使用与背景相关的CSS。除了Lotus Notes，我关心的一切。您可以在此处查看电子邮件支持的CSS属性的完整列表：www.campaignmonitor.com/css。另外，obv。，没有Javascript。

非常感谢任何帮助。

Answer 1

你可以像这样做

<table>
    <tr>
    <td style="width:250px; height:250px; background-color:red;text-align:center; vertical-align:middle">
    <img src="http://www.100marks.in/wp-content/uploads/2012/07/Sachin-Tendulkar-Pictures-Latest-2.jpg"  style="max-height:100%; max-width:100%"/>   

    </td>   

    </tr>


</table>

如果max-width和max-height不支持展望，您可以width:auto和height:auto参考http://jsfiddle.net/yJUH4/4/

http://jsfiddle.net/yJUH4/2/ [旧]

Answer 2

您需要将这些属性应用于表格单元格，并为图像指定固定大小（宽度或高度）。它会自动缩放。

<td valign="middle" align="center">
     <img src="..." width="100" />
</td>

Answer 3

使用Outlook 2013进行的一些实验表明，如果图像显示在表格之外，Outlook默认情况下会将其宽度缩小到窗口宽度。因此，如果你可以在没有桌子的情况下完成，至少你不会在Outlook中获得水平滚动条。

（所有其他电子邮件客户端根据您的列表支持max-width和max-height，因此在任何其他电子邮件客户端都不会出现问题。）

但是，如果您事先知道包含表格单元格的高度和宽度，那么真正的解决方案是在发送图像之前调整服务器端的大小。这不仅可以解决问题，还可以节省带宽。

如果不能选择调整图像大小本身，出于某种原因，另一种方法是计算（服务器端）大小应该是什么，并将其包括在HTML中。

如何执行此操作取决于您使用的模板系统;不幸的是你没有提到任何关于那个......

如何在固定大小的表格单元格内按比例缩放图像

3 个答案: