gmail应用中的HTML电子邮件中不需要的行
我正在为电子邮件流创建大量电子邮件。出于某种原因，我无法找到，当我在GMAIL APP中测试电子邮件时，在1px高度处有一些不需要的灰线。
我无法找出他们为什么在那里。它似乎只在GMAIL APP中 - 我正在使用litmus.com进行测试
电子邮件的HTML：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional //EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<!--[if !mso]><!-->
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<!--<![endif]-->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Vores 5 bedste råd inden boligkøbet</title>
<meta http-equiv="Content-Type" content="text/html charset=UTF-8" />
<!--[if (gte mso 9)|(IE)]>
<style type="text/css">
table {border-collapse: collapse;}
</style>
<![endif]-->
<!--[if mso]>
<style> body,table tr,table td,a, span,table.MsoNormalTable { font-family:Arial, Helvetica, sans-serif !important; }
</style>
<!--<![endif]-->
<style type="text/css">
@media screen and (max-width: 525px) {
h1 {
font-size: 30px !important;
}
}
</style>
</head>
<body bgcolor="#3d6e9c" style="padding: 0; margin: 0;">
<div style="background-color:#3d6e9c;">
<!--[if gte mso 9]>
<v:background xmlns:v="urn:schemas-microsoft-com:vml" fill="t">
<v:fill type="tile" src="http://naborapporten.its-umbraco.dk/emails/bg.jpg" color="#3d6e9c"/>
</v:background>r
<![endif]-->
<table height="100%" width="100%" cellpadding="0" cellspacing="0" border="1">
<tr>
<td valign="top" align="left" background="http://naborapporten.its-umbraco.dk/emails/bg.jpg">
<center>
<!--[if (gte mso 9)|(IE)]><table width="650" align="center" cellpadding="0" cellspacing="0" border="0"><tr><td><![endif]-->
<table cellspacing="0" cellpadding="0" border="0" style="border: none; border-collapse: collapse; width: 100%;">
<tr>
<td background="http://naborapporten.its-umbraco.dk/emails/bg.jpg" align="center" style="font-family: Arial; padding-top: 100px; padding-bottom: 100px; padding-left: 15px; padding-right: 15px;">
<table border="0" align="center" cellspacing="0" cellpadding="0" style="width: 100%; max-width: 650px; border-collapse: collapse; border: none; ">
<tr>
<td height="43" valign="bottom"><img src="http://naborapporten.its-umbraco.dk/emails/top.png" valign="bottom" style="font-family: Arial; max-width: 650px; width: 100%; height: auto; vertical-align: bottom; border-collapse: collapse;"></td>
</tr>
<tr>
<td align="center" bgcolor="#ffffff" style="font-family: Arial; padding-left: 15px; padding-right: 15px; padding-top: 45px; padding-bottom: 45px; border-collapse: collapse;">
<h1 style="color: #707986; font-size: 45px; margin-bottom: 0; mso-line-height-rule: exactly; line-height: 90%;"><b><b>Din Naborapport™</b></b></h1>
<!--[if (gte mso 9)|(IE)]><table width="470" align="center" cellpadding="0" cellspacing="0" border="0"><tr><td><![endif]-->
<table cellpadding="0" cellspacing="0" border="0" style="border-collapse: collapse; max-width: 470px; width: 100%;">
<tr>
<td align="center" style="color: #707986; font-size: 18px; padding-top: 45px; border-collapse: collapse;"><b>@Model.FullAddress</b></td>
</tr>
</table>
<!--[if (gte mso 9)|(IE)]></td></tr></table><![endif]-->
</td>
</tr>
<tr>
<td align="center" bgcolor="#ffffff">
<!--[if (gte mso 9)|(IE)]><table width="470" align="center" cellpadding="0" cellspacing="0" border="0"><tr><td><![endif]-->
<table border="0" cellspacing="0" cellpadding="0" align="center" style="max-width: 470px; width: 100%; border-collapse: collapse;">
<tr>
<td align="center" bgcolor="#ffffff" valign="middle" style="padding-top: 45px; padding-bottom: 45px; padding-left: 15px; padding-right: 15px;"><a href="@Model.NeighbourReportUrl"><img src="http://naborapporten.its-umbraco.dk/gfx/email/knap_til_naborapport.png" border="0" style="border: none; max-width: 100%; height: auto;"></a></td>
</tr>
<tr>
<td align="center" bgcolor="#ffffff">
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td align="center" bgcolor="#ffffff" style="font-family: Arial; max-width: 470px; width: 100%; padding-left: 15px; padding-right: 15px;">
<h2 style="color: #1fbba7; font-size: 30px; font-weight: bold;">Naborapporten giver dig et unikt indblik i nabolaget</h2>
<table>
<tr>
<td align="center" valign="middle" style="font-size: 18px; color: #5d6573; ">
<p><b>Hvilke typer er dine naboer?</b></p>
<p><b>Hvad er afstanden til skole, indkøb og transport?</b></p>
<p><b>Hvad beskæftiger dine naboer sig med til dagligt?</b></p>
<b>Hvad er prisudviklingen på boliger i området?</b>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
<!--[if (gte mso 9)|(IE)]></td></tr></table><![endif]-->
</td>
</tr>
<tr>
<td valign="middle" align="center" bgcolor="#ffffff" style="font-family: Arial; padding-top: 45px; padding-left: 15px; padding-right: 15px; border-collapse: collapse;">
<span style="color: #1fbba7; font-size: 18px; font-weight: bold;">Få gode råd til huskøbet på vores boligunivers</span>
</td>
</tr>
<tr>
<td align="center" bgcolor="#ffffff" style="padding-top: 45px; padding-bottom: 45px; padding-left: 15px; padding-right: 15px; border-collapse: collapse;">
<a href="#"><img src="http://naborapporten.its-umbraco.dk/emails/kvittering/knap_book.png" style="border: none; max-width: 100%; height: auto;" /></a>
</td>
</tr>
<tr>
<td bgcolor="#eeeeee" align="center" valign="middle" style="padding-top: 45px; border-collapse: collapse;">
<img src="http://naborapporten.its-umbraco.dk/emails/logo.png">
</td>
</tr>
<tr>
<td valign="top" style="border-collapse: collapse;"><img src="http://naborapporten.its-umbraco.dk/emails/bund.png" valign="top" alt="" style="max-width: 100%; height: auto;"></td>
</tr>
<tr>
<td height="92" align="center" valign="middle" style="border-collapse: collapse;"><a href="#" style="color: #ffffff !important; text-decoration: none; color: #ffffff; font-family: Arial; font-size: 18px;"><b>Afmeld</b></a></td>
</tr>
</table>
</td>
</tr>
</table>
<!--[if (gte mso 9)|(IE)]></td></tr></table><![endif]-->
</center>
</td>
</tr>
</table>
</div>
</body>
</html>
5 个答案:
答案 0 :(得分：1)
在我看来，你的背景颜色正在渗透。这是iOS设备以及其他一些应用程序的常见问题。您是否有理由在正文和第一个div标签上设置背景颜色？
答案 1 :(得分：0)
将表格边框设为＆＃34; 0＆＃34;
<table height="100%" width="100%" cellpadding="0" cellspacing="0" border="0">
希望这会对你有帮助！
答案 2 :(得分：0)
正如Gokul Maha所建议的那样，我会将第35行的border="1"更改为border="0"。但奇怪的是，单个实例会导致出现三个水平边框。
关于Litmus中的电子邮件预览，由于他们在收件箱中打开电子邮件并创建屏幕截图的方式，因此并不总是100％准确。如果您能够这样做，我建议使用Gmail应用的实际副本对其进行测试。结果可能不同。 Litmus节省了大量时间，但对于小细节，了解它在运行实际电子邮件应用程序的实际设备上的外观总是很好。
答案 3 :(得分：0)
我最近创建了一个类似的Mail同样的问题。在我的情况下，我试图将整个邮件边界化，但是它有效，但它在img和其他一些对象周围创建了小边框。
要解决此问题，我在style="border: none;"后面的每个td添加了table。这为我修好了。
还可以尝试将边框放在td上。如果某些Outlook版本位于table上，则边框似乎无法显示。
如果您根本不想要边框，则可以将第35行中的border="1"设置为0.
答案 4 :(得分：0)
您好，我通过将bgcolor="#ffffff" style="background-color:#ffffff;"放在body标签和td标签以及每个表格标签中来解决此问题。所有灰线从gmail应用程序中消失了。
相关问题
最新问题
- 我写了这段代码，但我无法理解我的错误
- 我无法从一个代码实例的列表中删除 None 值，但我可以在另一个实例中。为什么它适用于一个细分市场而不适用于另一个细分市场？
- 是否有可能使 loadstring 不可能等于打印？卢阿
- java中的random.expovariate()
- Appscript 通过会议在 Google 日历中发送电子邮件和创建活动
- 为什么我的 Onclick 箭头功能在 React 中不起作用？
- 在此代码中是否有使用“this”的替代方法？
- 在 SQL Server 和 PostgreSQL 上查询，我如何从第一个表获得第二个表的可视化
- 每千个数字得到
- 更新了城市边界 KML 文件的来源？