我有一个1x2 HTML表格,它将成为电子邮件的标题。第一列包含链接图像,第二列包含标题。
<table>
<tr>
<td width="50%" style="text-align:left; padding-left:10%;">
<a target="_blank" href="http://www.google.com/">
<img src="img/logo.jpg" alt="Logo"
style="width:30%; height:30%;"
/>
</a>
</td>
<td width="50%" style="text-align:right; padding-right:10%;">
<h2>Order Confirmation</h2>
</td>
</tr>
</table>
如您所见,左侧单元格中的图像左对齐,右侧单元格中的标题右对齐,每个元素距边缘10%的空间(填充)。
问题:我的图片尺寸被扭曲了!我将img的宽度和高度都设置为30%,但它仍然变得扭曲。我猜这与桌子有关,但我无法弄明白。让我知道!
ps:我必须为这个项目使用内联样式和表格。
答案 0 :(得分:3)
如以下SO {Resize image proportionally with CSS?}
所述您不应该尝试约束这两个尺寸,只需将宽度设置为30%,将高度设置为自动&#39;。试一试。