0

我正在构建一个移动友好的电子邮件，并且在电子邮件最初加载时主要图像不加载（页脚中的小 Facebook 和 twitter 图标加载）。我说，加载而不是显示 bc 屏幕上没有任何红色 x 或任何迹象表明那里应该有图像。但是，如果我返回收件箱并单击电子邮件再次查看，图像加载得很好。我在 iPhone 和 Android 的网络电子邮件客户端、雅虎和 gmail 上对此进行了测试，并且在所有这些情况下都发生了这种情况。我过去收到过移动电子邮件，图像加载得很好，所以它必须是我的代码。我一直在寻找答案，所以我希望这里有人熟悉这个问题并可以帮助我。如果您有任何问题，请告诉我。我非常感谢您的帮助。

注意：我发现它也没有在 Safari 中显示图像，而只是在第一次加载时显示。当页面重新加载时 - 就像在移动浏览器中一样，它会加载图像。

这是来自 Campaign Monitor 的链接：http: //testclient.createsend4.com/t/ViewEmail/y/8B8E5FE792737812

这是代码：

<html>
<head>
<!-- If you delete this tag, the sky will fall on your head -->
<meta name="viewport" content="width=device-width" />


<title></title>

<style type="text/css">
<!--
img {display:block; border:0;}
body {
    background-color: #ffffff;
    -webkit-font-smoothing:antialiased; 
    -webkit-text-size-adjust:none;
    margin:0;
    padding:0;
} -->
</style>

</head>

<body bgcolor="#ffffff" style="width:100%;height:100%;">

<table cellpadding="0" cellspacing="0" width="100%" align="center" bgcolor="#ffffff" border="0" style="font-family:Arial, Helvetica, sans-serif">
<tr><td>

<!-- HEADER -->
<div class="content" style="max-width:600px;margin:0 auto;display:block;">
<table cellpadding="0" cellspacing="0" height="37" align="center" bgcolor="#ffffff" border="0" style="font-family:Arial, Helvetica, sans-serif">
<tr>
<td valign="bottom" style="text-align:center; color:#5b5a5a; font-size:11px;">
Email not displaying correctly? <webversion style="color:#5b5a5a; text-decoration:underline;">View it in your browser</webversion>
</td>
</tr>
</table>

<table cellpadding="0" cellspacing="0" height="34" align="center" bgcolor="#ffffff" border="0" style="font-family:Arial, Helvetica, sans-serif">
<tr>
<td style="color:#939497; text-align:center;"><a href="#" style="color:#5c9b14;font-size:13px;text-decoration:none;" target="_blank"><strong>Shop Online</strong></a> &nbsp;|&nbsp; <a href="#" style="color:#5c9b14;font-size:13px;text-decoration:none;" target="_blank"><strong>Find A Store</strong></a> &nbsp;|&nbsp; <a href="#" style="color:#5c9b14;font-size:13px;text-decoration:none;" target="_blank"><strong>Forward To A Friend</strong></a>
</td>
</tr>
</table>
</div>

<table cellpadding="0" cellspacing="0" width="100%" align="center" bgcolor="#000000" border="0" style="font-family:Arial, Helvetica, sans-serif">
<tr><td>
<div class="content" style="max-width:600px;margin:0 auto;display:block;">
<table cellpadding="0" cellspacing="0" align="center" bgcolor="#000000" style="font-family:Arial, Helvetica, sans-serif" border="0">
<tr>
<td><a href="http://beyondrto.com/" target="_blank"><img src="images/2959_BYRTO_July_emailer_06.png" width="100%" style="display:block;border:0;color:#ffffff;" alt="Beyond RTO Home Furnishings &amp; Appliances For Less." border="0" /></a></td>
</tr>
</table>
</div>
</td></tr>
</table>


<!-- PROMO -->
<div class="content" style="max-width:600px;margin:0 auto;display:block;">

<table cellpadding="0" cellspacing="0" align="center" bgcolor="#ffffff" style="font-family:Arial, Helvetica, sans-serif" border="0">
<tr>
<td><a href="http://beyondrto.com/campaign/hristmas_in_july" target="_blank"><img src="images/2959_BYRTO_July_emailer_07.jpg" border="0" width="100%" style="display:block;" alt="Celebrate Christmas in July - Register to Win $1000 Shopping Spree!"/></a></td>
</tr>
</table> 

<table cellpadding="0" cellspacing="0" align="center" bgcolor="#ffffff" style="font-family:Arial, Helvetica, sans-serif" border="0">
<tr>
<td><img src="images/2959_BYRTO_July_emailer_08.jpg" border="0" width="100%" style="display:block;" alt="Plus enjoy this bonus offer and SAVE!"/></td>
</tr>
</table>

<table cellpadding="0" cellspacing="0" align="center" bgcolor="#ffffff" style="font-family:Arial, Helvetica, sans-serif" border="0">
<tr>
<td><img src="images/2959_BYRTO_July_emailer_09.jpg" width="100%" border="0" style="display:block;" alt="Reveal Your Deal with Beyond RTO!"/></td>
</tr>
</table>

</div>
<!-- FOOTER -->


<table cellpadding="0" cellspacing="0" width="100%" align="center" bgcolor="#000000" border="0" style="font-family:Arial, Helvetica, sans-serif">
<tr><td>
<div class="content" style="max-width:600px;margin:0 auto;display:block;">
<table cellpadding="0" cellspacing="0" align="center" bgcolor="#000000" style="font-family:Arial, Helvetica, sans-serif" border="0">
<tr>
<td><a href="http://beyondrto.com/" target="_blank"><img src="images/2959_BYRTO_July_emailer_10.png" width="100%" border="0" style="display:block;" alt="Beyond RTO Home Furnishings &amp; Appliances For Less."/></a></td>
</tr>
</table>

<table cellpadding="0" cellspacing="0" height="21" align="center" style="font-family:Arial, Helvetica, sans-serif" border="0">
<tr>
<td align="center" valign="top" style="font-size:13px;color:#939497;"><a href="#" style="color:#82c13a;font-size:13px;text-decoration:none;" target="_blank"><strong>Shop Online</strong></a> &nbsp;|&nbsp; <a href="#" style="color:#82c13a;font-size:13px;text-decoration:none;" target="_blank"><strong>Find A Store</strong></a> &nbsp;|&nbsp; <a href="#" style="color:#82c13a;font-size:13px;text-decoration:none;" target="_blank"><strong>Forward To A Friend</strong></a></td>
</tr>
</table>

<table cellpadding="0" cellspacing="0" align="center" style="font-family:Arial, Helvetica, sans-serif" border="0">
<tr>
<td><img src="images/2959_BYRTO_July_emailer_13.png" width="40" height="44" border="0" style="display:block;"/></td>
<td><img src="images/2959_BYRTO_July_emailer_14.png" width="36" height="44" border="0" style="display:block;"/></td>
</tr>
</table>

<table cellpadding="0" cellspacing="0" height="50" align="center" style="font-family:Arial, Helvetica, sans-serif" border="0">
<tr>
<td align="center" valign="top" style="font-size:10px;color:#bebebe;line-height:14px;">
&copy; Copyright 2013 Baber's. All Rights Reserved.<br/>
You are currently subscribed as [email]. Click here to <unsubscribe style="color:#82c13a;text-decoration:underline;">unsubscribe</unsubscribe>.</td>
</tr>
</table>
</div>
</td></tr>
</table>

</td></tr>
</table>


</body>
</html>
4

1 回答 1

0

我终于想通了。一旦我发现这也发生在 Safari 中，解决问题就更容易了。我发现有些表格没有定义宽度，Safari 需要一个宽度值，移动电子邮件客户端显然也是如此。我通常在所有桌子上都有宽度，所以这次没有意识到这是罪魁祸首。

于 2013-06-14T19:46:08.107 回答