在撰写 HTML 电子邮件时，我们遇到了一个奇怪的问题，即缩进毫无明显原因地出现在跨度内。
我已经包含了下面的 HTML，但据我所知，跨度没有应用填充、边距等。内联样式似乎都不是原因。假设我在这里遗漏了一些非常基本的东西。
底部两个电话号码左侧缩进:
(图片来自 Litmus 电子邮件测试应用程序对 Windows 7 HTC 手机的测试)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Title</title>
<meta name="robots" content="noindex,nofollow" />
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<meta name="viewport" content="width=device-width" />
<style type="text/css">
@media only screen and (max-device-width: 480px) {
body img.banner {max-width: 300px !important; height: auto !important;}
table {max-width: 300px overflow:visible; width: auto; }
}
div, p, a, li, td { -webkit-text-size-adjust:none; }
span { padding: 0; margin: 0; }
.appleLinks a {color:#400400; text-decoration:none;}
.appleLinksGray a:link,.appleLinksGray a:visited {color:#808080;}
.appleLinksGrayClean a:link,.appleLinksGrayClean a:visited {color:#808080; text-decoration:none;}
</style>
</head>
<body style="font-family: 'trebuchet ms', arial, helvetica, sans-serif; font-size: 12px;">
<table style="background-color: #ffffff; margin: auto; font-family: 'trebuchet ms', arial, helvetica, sans-serif; font-size: 13px;" border="0" cellspacing="0" cellpadding="0" width="627">
<tbody>
<tr>
<td colspan="2"><img class="banner" src="" alt="Alt" width="625" height="100" /></td>
</tr>
<tr>
<td colspan="2" style="text-align: left; padding-bottom: 20px; padding-left: 20px; padding-right: 20px; font-family: 'trebuchet ms', arial, helvetica, sans-serif; padding-top: 20px; color: #400400;"><p>Dear ~goesBy~,<br />
<br>
Text</p>
<p>Regards,<br>
Text
<br>
<br>
</p>
<p><span class="appleLinks">Address<br>
<br>
5:00 – 7:00 pm
</span></p>
<p><b style="font-family: arial, helvetica, sans-serif; color:#000;">Name<br />
</b><span style="font-family: arial, helvetica, sans-serif; white-space: nowrap; color: #808080; font-size: 8pt;">Manager<br />
<br />
</span><b><span style="font-family: 'times new roman', times, serif; color: #00644c; font-size: 10pt;"><br />
COMPANY </span></b><br />
<span class="appleLinksGrayClean" style="font-family: arial, helvetica, sans-serif; color: #808080; font-size: 8pt;">Address Line 1</span><br />
<span class="appleLinksGrayClean" style="font-family: arial, helvetica, sans-serif; color: #808080; font-size: 8pt;">Address Line 2</span><br />
<span class="appleLinksGray" style="font-family: arial, helvetica, sans-serif; color: #808080; font-size: 8pt;">111.111.1111</span><br />
<span class="appleLinksGray" style="font-family: arial, helvetica, sans-serif; color: #808080; font-size: 8pt;">111.111.1111 direct</span><br />
<span class="appleLinksGray" style="font-family: arial, helvetica, sans-serif; color: #808080; font-size: 8pt;">111.111.1111 mobile</span><br />
<a href="mailto:<a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="f1819483829e9fb19489909c819d94df929e9c" rel="noreferrer noopener nofollow">[email protected]</a>" style="font-family: arial, helvetica, sans-serif; color: #808080; font-size: 8pt;"><span class="appleLinksGray" ><a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="3b4b5e494854557b5e435a564b575e15585456" rel="noreferrer noopener nofollow">[email protected]</a></span></a></p></td>
</tr>
<tr>
<td style="padding-top: 20px;" colspan="2">
<div style="text-align: left; font-family: verdana; color: #333333; font-size: 9px;">Copyright</div>
</td>
</tr>
</tbody>
</table>
</body>
</html>
最佳答案
你检查过隐藏字符吗？有时，当您复制粘贴代码时，会包含特殊字符。主要来自字符集差异。尝试删除 html 标记之间的所有空白。
关于html - Windows Phone 中 <span> 标签前出现的缩进，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/12623971/