如何解决HTML 电子邮件被空白包围仅在移动设备上
在 Outlook 或 GMail 应用等移动客户端上查看时，我的 HTML 邮件会在实际邮件周围收到一个空白区域。
正如你在这里看到的，每一边都有一些空白。
https://i.stack.imgur.com/9bt8y.png
在麦当劳的时事通讯中，例如这个空白不存在。
https://i.stack.imgur.com/rVrDh.jpg
我想知道如何实现空白消失。
编辑
<head>
<style>
body {
margin:0;
}
#body {
color: #848484;
font-size: 18px;
line-height: 30px;
}
#body {
color:#dd9f33;
font-size: 18px;
line-height: 30px;
}
@media screen and (max-width: 760px) {
#body {
margin: 0;
font-size: 25px;
line-height: 40px;
}
}
</style>
</head>
<table role="presentation" cellpadding="0" cellspacing="0" width="100%" bgcolor="#ededed">
<tr>
<td align="center" valign="top">
<table style="padding: 23px" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td align="center" valign="top">
<table style="border-radius: 50px 50px 0 0" cellpadding="0" cellspacing="0" bgcolor="#ffffff"
width="600">
<tr>
<td id="body" align="left" valign="top" style="">
<div style="text-align: center;"><img width="600" src="some_image"></div>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td align="center" valign="top">
<table border="0" style="border-radius: 0 0 25px 25px" cellpadding="15" cellspacing="15"
bgcolor="#FFFFFF" width="600">
<tr>
<td id="body" align="left" valign="top">
Here I have the plain Mail content,simple
div tags
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td align="center" valign="top">
<table cellpadding="15" cellspacing="15" width="100%" bgcolor="#ededed">
<tr>
<td align="center" valign="top">
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
解决方法
您需要将 sizeof 添加到您的表中，即
border-collapse: collapse尽管实际上您应该为那些不接受 <style type="text/css">
table {
border-collapse: collapse;
}
</style>
代码的电子邮件客户端内联它，即：
<style>
如果您的 <table style="border-collapse: collapse;"> 部分中有自动化工具，您可以使用它来内联您的代码，例如 https://inliner.cm/
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
