直接套用网页HTML模板在邮件里会崩，因为邮件客户端不是浏览器：Outlook用Word引擎、Gmail剥离标签、QQ邮箱忽略class/id、Apple Mail不支持float和background-image；必须用嵌套表格布局、内联样式、显式尺寸及客户端特供hack实现兼容。
Wechat Article Html
下载
将 Markdown 文章转换为微信公众号兼容的纯 HTML 格式。当用户要求"转成微信格式"、"生成公众号文章 HTML"、"排版到微信草稿箱"、"微信粘贴格式"时触发。输出带内联样式的纯 HTML，微信编辑器可直接渲染，无需额外适配。支持标题、段落、列表、粗体、行内代码、表格、引用块、代码块、配图的完整转换。
为什么直接套用网页HTML模板在邮件里会崩
因为邮件客户端根本不是浏览器。Outlook桌面版用MS Word引擎解析HTML，Gmail会主动剥离<style></style>标签，QQ邮箱忽略所有class和id，Apple Mail对float和background-image支持极差。你写的<div class="card">在多数客户端里等于没写——不是bug，是设计如此。
<ul><li>所有布局必须用<code><table>嵌套，不能依赖<code>display: flex或grid
<style></style>块在Gmail中被整段删除，Outlook只认内联style属性<table>，外层<code>width="100%"，内层width="600"，移动端靠width="100%"强制单列
<td>单独写，比如<code>font-family: Arial, sans-serif;不能只写在父级
模板复用的关键：分离开发态与发送态
工程化不是把HTML文件扔进邮件系统就完事，而是建立email.html（带完整CSS的开发模板）和email-inlined.html（内联后用于发送的产物）两个版本。前者供人维护，后者才是真实发出去的东西。
- 开发模板里可以写
.btn { color: #fff; }，但发送前必须用工具（如premailer或inliner）把所有规则转成<td style="color:#fff;"> <li>变量占位统一用<code>$USER_NAME$这类字符串，不用{{name}}或<?php echo $name; ?>——避免模板引擎冲突，也方便用string.Replace()或str.replace()批量替换 - 图片路径必须为绝对URL，相对路径
./images/logo.png在Outlook里基本不加载 - 外链字体（如Google Fonts）全部失效，只能用
font-family: "Helvetica Neue", Arial, sans-serif;这类系统安全字体栈 - 外层容器必须是
<table width="100%" role="presentation">，加<code>role="presentation"防屏幕阅读器误读 - 按钮不能用
<a></a>加padding模拟，要套<table><tr><td style="background:#007bff;padding:12px 24px;">点击</td></tr></table> - Outlook专属hack：加
mso-table-lspace:0pt; mso-table-rspace:0pt;到table样式里，防止单元格间距失控 - Gmail兼容底线：所有
<p></p>必须包在<td>里，单独的<code><p>正文</p> <p><span>立即学习</span>“<a href="https://pan.quark.cn/s/cb6835dc7db1" style="text-decoration: underline !important; color: blue; font-weight: bolder;" rel="nofollow" target="_blank">前端免费学习笔记（深入）</a>”；</p>会被吃掉首尾空格甚至整段丢弃 - Apple Mail对
line-height敏感，必须带单位，line-height: 1.5em可，line-height: 1.5不行 - 模板中只用占位符，如
$ORDER_DATE$、$PRODUCT_LIST$，不带任何语法特征 - 替换前先检查占位符是否全部存在对应值，缺失时抛异常而不是静默留空——发错邮件比不发更糟
- Python可用
string.Template或str.replace()，避免format()或f-string导致意外格式化 - PHP建议用
file_get_contents()读模板，再用str_replace()逐个替换，不用eval()或include() - C#用
File.ReadAllText()+Replace("$NAME$", name)，注意$符号本身需转义处理
怎么让一个模板适配Outlook、Gmail、Apple Mail三端
没有“一次写完全平台兼容”的捷径，只有三类兜底策略叠加：结构降级 + 样式内联 + 客户端特供hack。
Python/PHP/C#里怎么安全注入数据到HTML模板
别在HTML字符串里拼接PHP或Python代码，那会引入执行风险且破坏模板可读性。真正安全的做法是纯文本替换+预编译校验。
最易被忽略的点：所有<td>必须显式设<code>valign="top"，否则Outlook默认valign="middle"会让文字悬浮在单元格中央，和预期排版完全不符。
