赛博钟馗：Gemini 2.5 Pro辅助快速定位和解决Email乱码问题[AI提效专题]

背景

在给一个客户的项目中，我们使用纯html嵌入到email中来附带表单，比如订单详情等信息。有一个客户A总是反馈说：这个订单上下间距太大了，不美观，而且一点点内容都要用两页纸。

比较

先来看看客户发送到截图是什么样子的

再比较一下，其他用户看到的样子：

明显可以看到客户A的内容确实看起间距很大，到底是什么原因。

查看Email原始内容

让客户把email直接转发过来，打开email进行查看，主要是查看email的源代码

可以看到，无论是“Online Order Form”还是“Deliver To” 这几个<td>标签都莫名其妙被加了很大的padding。并且在附近的tag中发现有“MsoNormal”这类class出现。

再结合客户A的邮件服务器是MS outlook，那么出现这种灵异现象的唯一解释就是邮件服务器悄悄地修改了原始的html。

AI上场

带着初步的判断，就把问题的现象和原始的html代码提交给Gemini进行分析，并且要求Gemini给出一个解决方法

不出所料

果然是因为Outlook服务器使用MS Word的HTML渲染引擎，简短的说：它会自动转换和添加一些格式，从而破坏的html原本的格式

AI给出的解决方案

使用完整的Html结构 确保嵌入email的是一个完整的html结构，包含DOCTYPE，<html><head><body> 这些tag，样例如下：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <!-- Important for some Outlook versions -->
    <title>Online Order Form</title>

</head>
<body style="margin: 0; padding: 0; background-color: #f4f4f4;">
    <!-- Your email table structure starts here -->

</body>
</html>

尽量使用内联样式inline style 就是不要使用<style>标签或者外部样式表，因为outlook对它的支持非常弱。
用表格进行布局 表格table布局适应性比较好
强制重置MsoNormal类 Outlook会自动对为定义样式的tag包裹<p class="MsoNormal">块，这个块会默认添加margin和height从而破坏可能的布局。消除MsoNormal类的方法是在<head>里添加如下代码：

<!--[if mso]>
<style type="text/css">
    .MsoNormal, p.MsoNormal {
        margin: 0 !important;
        line-height: normal !important; /* or specify a value */
    }
</style>
<![endif]-->

避免使用CSS样式缩写 比如padding: 5px, 最好写成padding: 5px 5px 5px 5px，或者分开写成 padding-top:5px; padding-bottom:5px; padding-left:5px; padding-right:5px;
使用Outlook专用的条件注释 针对outlook邮件的样式，在html头中添加：

<!--[if mso]>
    <style type="text/css">
        /* Styles only for Outlook desktop */
        .outlook-font { font-family: Arial, sans-serif !important; }
        .outlook-hide { display:none !important; mso-hide:all !important; }
    </style>
<![endif]-->

确实快

毫不夸张地说，AI帮我迅速找到问题并给出解决方案，绝对是效率高手。

后记-危机并存

AI作为辅助定位和解决问题的工具，这个是再直接不过的用途，在这个过程中有一些启发：

AI懂得比你多得多 你没有遇到过的问题，AI都知道，所以无论自己的经验有多少，AI懂得一定比你多，这个毫无疑问。
效率提升 快速分析和定位问题，给出解决方案，稳！准！狠！
人是不是没事干了 在这个过程中，人当然起到了不可或缺的作用，要把自己的思考转换成给AI的输入，越是有价值的信息，AI越能快速找到对应的答案。
AI的答案一定是对的吗 类似本文中的例子，其本身是有可重复性的，也就是说我们通过验证或者实验是可以看到问题“已经解决”或者“未解决”，这种有客观评判标准的例子，对于AI给出的答案来说，我倾向于相信，其他的无客观评判标准的东西，我倾向于批判地思考，设法多渠道多来源求证。
人的能力会退化 想象一下，如果未来人不用思考了，只需要做信息的搬运工，那人类几百万年进化而来的大脑是不是会退化，是不是会退化成动动手指或者动动眼球就可以的生物。
那么我们离AI全程自主看现象解决问题还有多远 不会非常遥远，但是还是有一段时间，我认为还需要5年以上，这个过程中，我们可能会看到多个Agent进来联合来解决问题，我们可能会看到各种操作系统级别的Agent默认进驻我们的电脑，我们可能会首先看到操作系统级别的大的AI进化，所以未来很多当前在讨论的Agent或者自动化工具都会变成随时可以获得的，而且几乎没有成本，而不是像现在这样调用一个API都要产生费用。