使电子邮件 Header 在多个客户端保持一致

Question

我有一封电子邮件 header，它被分割成不同的图像，这样它们每个都可以 link 到一个网页。

我似乎无法对 header 进行编码，以便在将以下代码添加到 mailchimp 时它在大多数电子邮件客户端中保持在一起。

成品应该是这样的： http://i61.photobucket.com/albums/h49/Rocket_Range_77/Demo-header-full_zpswkpyuqa6.png

这是我一直在处理的代码，但运气不佳：

<a href="https://espn.com">
<img src="http://i61.photobucket.com/albums/h49/Rocket_Range_77/Demo-
header_01_zpsnfqldsnw.jpg" alt="Company Logo" href="http://espn.com" 
align="left"/>
</a>

<a href="https://comcast.net">
<img src="http://i61.photobucket.com/albums/h49/Rocket_Range_77/Demo-
header_02_zps8f6i1fvw.jpg" alt="Product Image" href="https://comcast.net" 
align="left"/>
</a>

<a href="https://cnn.com">
<img src="http://i61.photobucket.com/albums/h49/Rocket_Range_77/Demo-
header_03_zpsdk8geogp.jpg" alt="Shop" href="https://cnn.com" align="left"/>
</a>

<a href="https://apple.com">
<img src="http://i61.photobucket.com/albums/h49/Rocket_Range_77/Demo-
header_04_zpsirg8szkp.jpg" alt="Customer Service" href="https://apple.com" 
align="left"/>
</a>

<a href="https://amazon.com">
<img src="http://i61.photobucket.com/albums/h49/Rocket_Range_77/Demo-
header_05_zpssvi0qteo.jpg" alt="Products" href="https://amazon.com" 
align="left"/>
</a>

Answer 1

这就是您所追求的。您应该使用 tables 将图像放在正确的位置。看看 table 结构，你就会明白我做了什么。

你的代码在我删除的图像标签上有 hrefs。
不要忘记图像上的显示块和
所有链接都将在新版本中打开window

下面是一个代码，试一试，让我知道它是否适合你。

<table width="600" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td>

<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td><a href="https://espn.com" target="_blank">
<img src="http://i61.photobucket.com/albums/h49/Rocket_Range_77/Demo-
header_01_zpsnfqldsnw.jpg" alt="Company Logo" style="display:block;" />
</a></td>
</tr>
<tr>
<td><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td><a href="https://cnn.com" target="_blank">
<img src="http://i61.photobucket.com/albums/h49/Rocket_Range_77/Demo-
header_03_zpsdk8geogp.jpg" alt="Shop" style="display:block;" />
</a></td>
<td><a href="https://apple.com" target="_blank">
<img src="http://i61.photobucket.com/albums/h49/Rocket_Range_77/Demo-
header_04_zpsirg8szkp.jpg" alt="Customer Service" style="display:block;" />
</a></td>
<td><a href="https://amazon.com" target="_blank">
<img src="http://i61.photobucket.com/albums/h49/Rocket_Range_77/Demo-
header_05_zpssvi0qteo.jpg" alt="Products" style="display:block;" />
</a></td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
<td width="148"><a href="https://comcast.net" target="_blank">
<img src="http://i61.photobucket.com/albums/h49/Rocket_Range_77/Demo-
header_02_zps8f6i1fvw.jpg" alt="Product Image" style="display:block;" />
</a></td>
</tr>
</tbody>
</table>

另外我认为代码上的图像只是用于 Stack Overflow？发送带有链接到照片桶的图片的电子邮件会导致递送问题。

干杯

使电子邮件 Header 在多个客户端保持一致

Make Email Header Stay Together Across Multiple Clients

html

html-email