2

我一直在为一位客户编写这份时事通讯。一切看起来都很完美，完全符合我的要求。甚至 Outlook 也能理解时事通讯，但是……Gmail ……我真的不明白浏览器中的 Gmail 有什么问题。我有这段代码。

<table class="w650" width="650" cellpadding="0" cellspacing="0" border="0">
    <tbody>
        <tr>
            <td height="20"></td>
        </tr>

        <tr>
            <td width="225" bgcolor="#e1822d" valign="top" align="left">
                <div style="padding:12px 20px 0px 20px;">
                    <div style="font-family:arial;font-size:20px;color:#FFFFFF;line-height:36px;">
                        <singleline label="Title">Tenerife</singleline>
                    </div>
                    <div style="font-family:arial;font-size:11px;color:#FFFFFF;line-height:20px;">
                        <multiline label="Description">Click to see all properties <br /> Lorem Ipsum Dolor sit amet</multiline>
                    </div>
                </div>
            </td>
            <td width="425" valign="top" align="left">
                <img editable="true" src="images/side_image_01.jpg" label="Image" width="425" border="0" style="border:none;" alt="Image" />
            </td>
        </tr>
    </tbody>
</table>

在所有其他邮件客户端中，它的输出如下： 在此处输入图像描述

但在 Gmail 和 Gmail 中，它仅在橙色列中以额外大小输出：

在此处输入图像描述

我知道专注于它是愚蠢的，但我的 HTML 代码是防弹的，即使是旧的 Outlook 邮件客户端也能正确显示它，但 Gmail 却扭曲了它，这让我很恼火。

有谁知道我应该在 inline css 或 head css 或任何东西中输入什么 - 让 Gmail 理解？

4

2 回答 2

2

添加display: block;到图像标签的style属性，或者img { display: block; }如果您在<style>任何地方都有一个部分并且还需要将其应用于其他图像。

由于某种原因，Gmail 为未明确指定为display: block.

于 2013-04-08T11:50:51.063 回答
1

每个邮件客户端都有不同的 HTML 呈现技术。

我无法真正找出这两个图像的区别。我看到两个图像是相同的。

据我了解，我只能说，您可以设置固定宽度内联，以强制 Gmail 使用您的样式。!important可以帮助你强制造型。

于 2013-04-08T11:40:47.470 回答