HTML5空格在邮件模板中不可靠,因各客户端会合并空格或忽略 ;最稳妥方案是用带固定像素width的占位,并设cellspacing="0" cellpadding="0"。

HTML5 中的空格在邮件模板里基本不可靠,直接写多个空格会被客户端合并成一个,这是绝大多数邮件客户端(Outlook、Apple Mail、Gmail Web/App)的默认行为,和浏览器渲染逻辑不同。
为什么 在部分邮件客户端会失效
很多邮件客户端(尤其是 Outlook Desktop 使用 Word 渲染引擎)对 的支持不一致:有的会忽略、有的转成普通空格、有的甚至破坏换行。更麻烦的是,某些客户端(如 iOS Mail)在「回复」或「转发」时会自动清理冗余 ,导致排版坍塌。
- Outlook 2016/2019/365(Windows):
常被当普通空格处理,无法撑开间距 - Gmail(Web):支持
,但嵌套在或 中可能被截断- Android Gmail App:对连续
有数量限制,超 3~4 个就只渲染 1 个用
+font-size/letter-spacing强控空隙比依赖空格更稳的方式,是用内联样式控制字符间距或隐藏占位元素。注意:必须用内联样式,且避免用
margin或padding(Outlook 对它们支持极差)。Text
-
font-size: 0配合可创建“透明占位”,再用letter-spacing拉开文字间距 - 避免用
width或min-width控制空隙——Outlook 不识别多数块级宽度属性 - 所有样式必须写在
style属性里,不能依赖外部 CSS 或标签
表格单元格(
)才是最稳的“空格容器” 邮件模板中真正可靠的空白控制方式,是用带固定宽度的
占位。这是所有主流客户端都支持的方案。 立即学习“前端免费学习笔记(深入)”;
Hello World -
width必须设为具体像素值(如"10"),百分比在 Outlook 中常被忽略 - 务必设置
cellspacing="0" cellpadding="0",否则默认边距会干扰对齐 - 不要试图用
或——Outlook 完全不支持
真正难的不是加空格,而是让“空格在所有客户端看起来一样”。哪怕只是两个词之间加 4px 间隙,也得放弃语义化写法,回到表格占位的老路。别信预览工具,一定要真机测 Outlook、iOS Mail 和 Gmail App。
- Android Gmail App:对连续











