我正在尝试在流体设计中创建新闻稿模板。问题是标题图像在Gmail移动设备和其他一些小客户端中接收和查看时会垂直拉伸。通过在表格中定义最小高度和最大高度的解决方案是不行的,我没有技巧。
<html>
<head>
<title>Title</title>
</head>
<body style="margin:0; height:100%; width:100%;">
<table bgcolor="#FFFFFF" cellpadding="0" cellspacing="0" border="0" style="width:100%;border-collapse:collapse;">
<tr>
<td style="background-color:#81BCCE;"> </td>
<td width="600" bgcolor="#F3F3F3" style="font-family:Trebuchet MS, Helvetica, Arial, sans-serif;">
<center>
<table border="0" cellspacing="0" cellpadding="0" align="center" style="width: 100%; min-width: 300px; max-width: 600px; height: auto; max-height: 120px; min-height: 60px;" >
<tr>
<td>
<a href="testlink.html" target="_blank"><img src="https://bloodstonescifi.files.wordpress.com/2013/09/banner11-600-x-120.jpg" alt="Image" border="0" style="font-size: 20px; color: #000000; margin:0px; padding:0px; width:100%; max-width: 600px; min-width: 300px; height:auto; max-height: 120px; min-height: 60px;"></a>
</td>
</tr>
</table>
<table border="0" cellspacing="0" cellpadding="0" align="center" >
<tr>
<td>
This is some text content!
</td>
</tr>
</table>
</center>
</td>
<td style="background-color:#81BCCE;"> </td>
</tr>
</table>
<!-- END CONTENT AREA -->
</body>
</html>
&#13;
此处使用的图像仅仅是真实图像的空间支架,但600 x 120的尺寸是正确的。它在此处编码的方式显示了Gmail移动设备中的拉伸图像。 是否有任何技巧或解决方法来解决这个问题?
编辑:
是的,如果你测试一下,它看起来是正确的。我现在将用实际图像替换spaceholder,然后提供关于修复的反馈,以便其他人阅读类似的问题。
编辑:
问题已经解决了。这是因为我使用的发送系统在某些条件下为图像添加了固定的高度和宽度。