0

我试图通过这个问题已经有一段时间了，并试图通读许多主题，但没有任何效果......

问题是我有一个 html（图像）电子邮件，它在所有桌面客户端上都能完美运行，但在 iPhone 和 Gmail 应用程序上却有一些问题。

当我缩放或移动手机时，它会在某些分辨率下显示表格之间的小间隙。由于它有时会消失，我认为这是一个渲染问题，但我该如何避免呢？

此处包含不同图像的完整 zip - 您可以看到在普通浏览器和客户端中没有间隙，但如果您将其作为 html 电子邮件发送，则在某些分辨率下 Gmail 应用程序或 iPhone 中存在小间隙（当您缩放或打开时） SE）围绕“按钮”行。

我认为这些是表格之间的一些边框或轮廓，但是当表格看起来像下面的代码时，我认为它不应该是这样的:)

<body bgcolor="#efefef" style="border:none; margin: 0; padding: 0; background: #efefef;">
    <center bgcolor="#efefef" style="border:none; background: #efefef;">
        <table bgcolor="#efefef" style="border:none; background: #efefef;">
            <tr>
                <td valign="bottom" width="100%" height="50" bgcolor="#efefef" style="border:none; background: #efefef;">
                    &nbsp;
                </td>
            </tr>
            <tr>
                <td valign="bottom" width="100%" height="100%" bgcolor="#efefef" style="border:none; background: #efefef;">
                    <table width="600" class="part0-top" border="0" cellpadding="0" cellspacing="0" style="outline: 0; border:none; border-spacing:0; margin-top: -1px; margin-bottom: -1px; margin-left: 0; margin-right: 0; padding: 0; border-collapse: collapse; width: 600px; min-width: 600px; background: #fbfbfb;">
                        <tr width="600" style="white-space: nowrap; border:none; width: 600px; min-width: 600px;" align="center">
                            <td valign="bottom" align="center" width="600" style="border:none; width: 600px; min-width: 600px;">
                                <img border="0" src="https://gallery.mailchimp.com/4bad622b5a83be7ae967ded92/images/121e2b35-d2bf-432e-af5f-ca5d2bed02fc.jpg" alt="Bang & Olufsen" width="600" style="border:none; width: 600px; min-width: 600px; margin: 0; padding: 0; display: block; outline: none">
                            </td>
                        </tr>
                    </table>
                    <table width="600" class="part1-header" border="0" cellpadding="0" cellspacing="0" style="outline: 0; border:none; border-spacing:0; margin-top: -1px; margin-bottom: -1px; margin-left: 0; margin-right: 0; padding: 0; border-collapse: collapse; width: 600px; min-width: 600px; background: #fbfbfb;">
                        <tr width="600" style="white-space: nowrap; border:none; width: 600px; min-width: 600px;" align="center">
                            <td valign="bottom" align="center" width="30" style="border:none; text-align: left; width: 30px; min-width: 30px;">
                                &nbsp;
                            </td>
                            <td valign="bottom" align="center" width="470" style="border:none; text-align: left; width: 470px;">
                                <a href="http://www.bang-olufsen.com/en" target="blank" style="border:none; text-decoration: none !important; outline: none !important;">
                                    <img border="0" width="122" src="https://gallery.mailchimp.com/4bad622b5a83be7ae967ded92/images/ce1f5c26-972b-4043-8e44-0ca6b8d5a3ec.jpg" alt="Bang & Olufsen" style="border:none; width: 122px; margin: 0; padding: 0; display: block; outline: none">
                                </a>
                            </td>
                            <td valign="bottom" align="center" width="70" style="border:none; text-align: right; width: 70px;">
                                <a href="http://www.beostore.cz" target="blank" style="border:none; text-decoration: none !important; outline: none !important; display: block; text-align: right;">
                                    <img border="0" width="70" src="https://gallery.mailchimp.com/4bad622b5a83be7ae967ded92/images/a0c2157a-a67d-4149-8df5-5e3b5419dbe8.jpg" alt="Beostore.cz | Bang & Olufsen" style="border:none; width: 70px; margin: 0; padding: 0; display: block; outline: none">
                                </a>
                            </td>
                            <td valign="bottom" align="center" width="30" style="border:none; text-align: right; width: 30px; min-width: 30px;">
                                &nbsp;
                            </td>
                        </tr>
                    </table>

Android - Gmail 应用程序：差距的屏幕

谢谢你的帮助！:)

4

0 回答 0