Question

我正在制作一封电子邮件，其中每月会有3张图片加载促销优惠。几个月可能只有2个优惠，而不是第3个图像的想法是只保存1x1 spacer.gif所以非开发人员可以只更新促销图像。

问题在于，如果我没有在每个图像上设置特定的高度，当替换spacer.gif时，浏览器会将其显示为一个巨大的间隙，基本上高度与宽度相同。

有没有人知道如何解决这个问题，所以没有这么大的差距，但我不必在那里锁定高度？

以下是相关代码：

<table width="700" align="center" bgcolor="#000000" cellpadding="0" cellspacing="0"    border="0" style="min-width:700px">
            <tbody>
                <tr>
                    <td><img src="images/spacer.gif" width="40" height="1" border="0" style="display:block; outline:none; text-decoration:none; -ms-interpolation-mode: bicubic;"/></td>
                    <td>
                    <table width="620" align="center" bgcolor="#000000" cellpadding="0" cellspacing="0" border="0" style="min-width:620px">
                    <tbody>
                        <tr>
                            <td>
                            <!-- Offer 1 -->
                            <a href="" title="Offer" target="_blank"><img src="images/cm_spof_01.gif" width="620" alt="Offer" border="0" style="display:block; outline:none; text-decoration:none; -ms-interpolation-mode: bicubic; font-size:16px; color: #f1f1f1; font-family:arial, sans-serif; height:auto;" /></a>
                            <!-- Offer 2 -->
                            <a href="" title="Offer" target="_blank"><img src="images/cm_spof_02.gif" width="620" alt="Offer" border="0" style="display:block; outline:none; text-decoration:none; -ms-interpolation-mode: bicubic; font-size:16px; color: #f1f1f1; font-family:arial, sans-serif; height:auto;" /></a>
                            <!-- Offer 3 -->
                            <a href="" title="Offer" target="_blank" style="height:auto;"><img src="images/cm_spof_03.gif" width="620" alt="Offer" border="0" style="display:block; outline:none; text-decoration:none; -ms-interpolation-mode: bicubic; font-size:16px; color: #f1f1f1; font-family:arial, sans-serif; height:auto;" /></a>
                            </td>
                        </tr>
                    </tbody>
                    </table>
                    </td>
                    <td><img src="images/spacer.gif" width="40" height="1" border="0" style="display:block; outline:none; text-decoration:none; -ms-interpolation-mode: bicubic;"/></td>
                </tr>
            </tbody>
        </table>

Answer 1

让您的1x1 gif更宽，如600x1。

此外，您可以在所有图像标记上保留高度，例如，这是创建流体图像的方法：

<img alt="" src="" width="100%" style="margin: 0; border: 0; padding: 0; display: block;">

电子邮件间距中的动态图像

1 个答案: