在Sublime中写HTML邮件模板需禁用CSS外部引用与复杂布局，仅用table结构和行内style属性，字体限用安全栈，推荐Emmet等插件提效，须通过Thunderbird或Mailtrap实测多端渲染效果。
怎么在 Sublime 里写 HTML 邮件模板才不会被 Gmail 砍样式
HTML 邮件不是网页，flex、float、@media 基本没用，Gmail 会直接干掉 <style> 块和大部分 CSS 类。必须内联样式，且只用表格布局 + 行内 style 属性。
实操建议：
- 别用 CSS 预处理器或构建工具生成邮件 HTML——Sublime 本身不编译，你得手动写或靠插件补全
- 优先用
table+tr+td搭结构，div在 Outlook 和 Gmail App 里容易塌 - 所有样式写进
style="..."，比如<td style="font-family: Arial, sans-serif; color: #333;"> - 字体要用安全栈：
"Helvetica Neue", Helvetica, Arial, sans-serif，别写"PingFang SC"这种 macOS 专属字体
Sublime 插件推荐：哪些能真帮上忙，哪些纯属添乱
Sublime 本身不带邮件模板支持，但几个插件能省大量重复劳动。注意：插件不能替代对邮件客户端限制的理解。
真正有用的：
立即学习“前端免费学习笔记（深入）”；
-
Emmet：敲table>tr*2>td*3回车就能生成嵌套表格骨架，比手写快十倍 -
Color Highlighter：实时高亮#ffffff这类颜色值，避免写错十六进制（#fff在某些 Outlook 版本里不认） -
SideBarEnhancements：右键快速新建template-email.html文件，不用切到 Finder
慎用的：
-
CSScomb：排序 CSS 属性没意义——邮件里压根不该有外部 CSS -
AutoFileName：对邮件模板路径提示基本无用，因为通常不引用外部资源
测试环节绕不开：本地预览 ≠ 邮件真实效果
Sublime 里按 Ctrl+Shift+P → Preview in Browser 看的是 Chrome 渲染结果，和 Gmail 完全是两套规则。
必须做的验证步骤：
- 把 HTML 文件拖进 Thunderbird 或 Apple Mail 本地预览——它们比浏览器更接近真实邮件渲染逻辑
- 用
putsmail.com或Mailtrap发测试信，看 iOS / Android / Outlook 客户端实际表现 - 特别检查
background-image：90% 的邮件客户端不支持，包括 Gmail Web 和 Outlook.com - 图片务必用绝对 URL，且加
alt属性——很多邮箱默认关闭图片加载
为什么 inline-css 工具生成的代码，在 Sublime 里改起来反而更费劲
像 juice 或 premailer 这类工具能把外部 CSS 转成行内样式，但输出结果往往冗长难读，而且破坏可维护性。
真实协作中容易卡住的地方：
- 修改某处文字颜色后，得重新跑一遍 inline 工具，否则样式丢失——意味着你不能直接在 Sublime 里改完就发
- 工具常把
!important塞进每个style，导致调试时 Chrome DevTools 显示“已禁用”，但其实它在邮件里根本无效 - 某些工具会把
margin转成padding模拟（因 Outlook 不支持 margin），但数值不准，需要人工校验
建议：初稿用工具生成基础结构，后续所有微调都在 Sublime 里直接改行内 style，别再走 pipeline。
