我正在Mailchimp中创建一个模板来发送新闻稿。该模板包含一个可重复的部分,其中包含一个前缀大小的图像。由于某种原因,它会从img元素中去除width =“”和height =“”值,并且只有在每个图像的图像设置中手动设置这些值时才包含它们。这意味着如果用户上传的图片大小不同而且没有手动输入正确的尺寸,那么在Outlook中图片会显示为完整尺寸。
为了使它在设计编辑器上更加用户友好,它使用宽度/高度css样式来显示图像大小,所以它说(例如)350px宽,234px高,你可以上传更大的图像它以350px的宽度显示它(这会让用户认为它是正确的)。但是它不包括html img width / height值,除非你手动指定它们,这意味着Outlook中的图像大小是错误的。
有没有人知道强制至少将html宽度变量自动包含在img元素中?否则,用户必须手动为每个图像手动设置相同的宽度/高度,如果他们忘记了,那么它将无法在Outlook中正确显示?
谢谢,
戴夫
答案 0 :(得分:2)
对于其他参考我现在已经使用mailchimp并使用https://www.snip2code.com/Snippet/25348/HTML-Email-Template--max-width-hack-for-(下面)的代码和img的max-width / max-height css值的组合修复了outlook中的问题:
<!--[if (gte mso 9)|(IE)]>
<center>
<table>
<tr>
<td width="600">
<![endif]-->
<div style="max-width: 600px; margin: 0 auto;">
<p>This text will be centered and constrained to 600 pixels even on Outlook which does not support max-width CSS</p>
</div>
<!--[if mso]>
</td>
</tr>
</table>
</center>
<![endif]-->
答案 1 :(得分:2)
要解决此问题,您必须在实际图像上指定最大宽度,并确保将其内联到标记上,如下所示:
<img mc:edit="image" src="image.jpg" width="200" style="max-width:200px;">
不计算它是否包含在头部的CSS中。
使用上面的标记,MailChimp编辑器会在用户编辑图像后添加width =“200”。但是如果用户没有编辑图像,遗憾的是没有添加宽度,所以上面的修补程序值得一试。