消除Android Gmail和Yahoo客户端中HTML行之间的差距

时间:2017-12-13 06:10:39

标签: android html css outlook

我正在从4个切片图像构建一个简单的签名。一个大标题图像,在下一行中跨越3个较小的并排图像。

当我在Outlook 2013/2016中查看签名时,它可以正常显示,但是当在Android上的Android Gmail或Yahoo客户端上从Outlook接收/查看时,表行之间存在间隙。

在PC,Thunderbird或Outlook上查看Gmail时,它会显示完美。

现在花了很多时间阅读建议并尝试所有不同的选项和组合,并且无法正确使用。我只是不知道为什么雅虎和Andriod Gmail客户端在表格行之间存在差距。

进一步了解如何解决这个问题将不胜感激。

<html>
<head>
<title>Signature</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style type"text/css" media="screen">
</style>
</head>
<body>
<table width="600" border="0" cellspacing="0" cellpadding="0" style="font-size:1px; line-height:0; mso-margin-top-alt:0px;">
    <tr style="display: block; white-space: nowrap;">
        <td style="border-collapse: mso-table-lspace: 0pt; mso-table-rspace: 0pt; mso-line-height-rule: exactly; collapse; line-height: 0; display: inline-block;"><img height="100" src="https://s20.postimg.org/432rtyob1/image.png" width="600" alt="Example Image" style="display: block; border=0" /></td>
    </tr>
    <table width="600" border="0" cellspacing="0" cellpadding="0" style="min-width:600px;">
        <tr style="display: block; white-space: nowrap;">
            <td width="253" height="30" style="display: inline-block;"><a href="#"><img height="30" src="https://s20.postimg.org/ru25c2gsd/image.png" alt="" width="253" style="display: block;" border="0" /></a></td>
            <td width="107" height="30" style="display: inline-block;"><a href="#"><img height="30" src="https://s20.postimg.org/za1exvjx9/prof.png" alt="" width="107" style="display: block;" border="0"/></a></td>
            <td width="240" height="30" style="display: inline-block;"><a href="#"><img height="30" src="https://s20.postimg.org/za1exvrn1/web.png" alt="" width="240" style="display: block;" border="0" /></a></td>
        </tr>
    </table>
</table>
</body>
</html>

0 个答案:

没有答案