Django HTML邮件模板如何正确显示字重300的Inter字体

HTML邮件渲染规则和普通网页存在本质差异，该问题和Django的邮件发送逻辑无关：

• Gmail、桌面端Outlook等绝大多数主流邮件客户端会默认剥离<head>标签内的外部资源引用，你编写的Google Fonts<link>标签会被直接删除，Inter字体根本未被加载。
• 多数邮件客户端对<style>块内的@font-face自定义字体规则支持度极低，仅苹果系邮件、少数网页端邮箱支持内嵌web字体，Windows端Outlook、部分企业自建邮箱完全不支持任何外部自定义字体。
• 原有代码存在两处隐性问题会加重样式异常：一是nombre文本位置的span闭合标签误写为</name>，会触发部分客户端DOM解析错误；二是table标签的cellspacing、cellpadding属性使用了中文弯引号，客户端无法识别对应属性值，会导致布局错乱。

1. 必做：配置可靠的字体降级兜底 #

这是保证所有客户端显示效果一致的基础，HTML邮件开发不能依赖单一自定义字体：

• 将所有内联样式里的字体栈从font-family: 'Inter', sans-serif;替换为跨平台适配的兜底字体序列，保证自定义字体加载失败时，视觉效果尽可能接近设计预期：

  font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  

• 给所有文本标签显式添加内联样式font-weight: 300;，避免客户端默认给p、span标签设置的默认字重覆盖配置。
• 修正代码中的语法错误：把所有误写的</name>闭合标签改为</span>，把table属性里的中文弯引号替换为标准英文半角双引号。

2. 兼容支持web字体的客户端显示Inter 300 #

针对苹果邮件、Gmail网页端等支持自定义字体的客户端，不要用<link>标签引入字体：

• 删除原有的Google Fonts<link>标签
• 在<body>标签的最开头插入内嵌<style>块，直接写入Inter 300字重的@font-face定义即可，你可以从之前引用的Google Fonts链接的返回内容中拿到对应CSS代码。将style块放在body内部可以避免被部分客户端直接剥离。

注意事项 #

不存在能让所有邮件客户端100%显示Inter 300字体的方案，HTML邮件的兼容原则为渐进增强：在支持自定义字体的客户端显示目标字体，不支持的客户端自动降级到视觉接近的系统字体，优先保证内容可读性、布局一致性。

内容的提问来源于stack exchange，提问作者Clerni