无法使用Velocity模板为邮件正文设置样式的技术求助

看起来你遇到了邮件客户端不识别Velocity模板里样式的问题——这在邮件开发里太常见了，毕竟不同邮件客户端对HTML/CSS的支持差异很大，尤其是Outlook这类“顽固分子”。结合你的情况，我给你几个针对性的解决方案：

1. 先确认邮件的Content-Type是否正确 #

这是最容易忽略的前提：如果发送邮件时把Content-Type设成了text/plain，那不管你写多少样式，邮件都会以纯文本显示。你需要确保代码里把内容类型设为text/html，比如Java里的写法：

message.setContent(velocityRenderedContent, "text/html; charset=utf-8");

2. 放弃<head>里的<style>，改用内联样式 #

90%的邮件客户端（尤其是Outlook）不支持<head>中的内嵌样式，最稳妥的方式是把样式直接写在HTML元素的style属性里。比如把你的模板改成这样：

<!DOCTYPE html>
<html>
<head>
    <title>User Information</title>
</head>
<body style="font-family: verdana; margin: 0; padding: 20px;">
    <table style="width: 500px; border-collapse: collapse; border: 1px solid #eee;">
        <tr style="background-color: #f5f5f5;">
            <th style="border: 1px solid #ddd; padding: 10px; text-align: left;">User ID</th>
            <th style="border: 1px solid #ddd; padding: 10px; text-align: left;">Name</th>
            <th style="border: 1px solid #ddd; padding: 10px; text-align: left;">Email</th>
        </tr>
        <tr>
            <td style="border: 1px solid #ddd; padding: 10px;">$userId</td>
            <td style="border: 1px solid #ddd; padding: 10px;">$userName</td>
            <td style="border: 1px solid #ddd; padding: 10px;">$userEmail</td>
        </tr>
    </table>
</body>
</html>

3. 若坚持用内嵌样式，做客户端兼容处理 #

如果不想写大量内联样式，可以针对不同邮件客户端做兼容，比如给Outlook单独加条件注释：

<!DOCTYPE html>
<html>
<head>
    <title>User Information</title>
    <!--[if mso]>
    <style>
        body { font-family: verdana; }
        table { width: 500px; border-collapse: collapse; }
        th, td { border: 1px solid #ddd; padding: 10px; }
        .header-row { background-color: #f5f5f5; }
    </style>
    <![endif]-->
    <!-- 其他客户端支持的内嵌样式 -->
    <style>
        body{ font-family: verdana; margin: 0; padding: 20px; }
        table { width: 500px; border-collapse: collapse; border: 1px solid #eee; }
        th, td { border: 1px solid #ddd; padding: 10px; text-align: left; }
        .header-row { background-color: #f5f5f5; }
    </style>
</head>
<body>
    <table>
        <tr class="header-row">
            <th>User ID</th>
            <th>Name</th>
            <th>Email</th>
        </tr>
        <tr>
            <td>$userId</td>
            <td>$userName</td>
            <td>$userEmail</td>
        </tr>
    </table>
</body>
</html>

4. 检查Velocity模板的特殊字符转义 #

如果你的样式里包含$符号（比如font-size: $14px），Velocity会把它当成变量解析，导致样式错乱。这种情况需要用\转义：

<style>
    .price { font-size: \$16px; color: #2ecc71; }
</style>

调试小技巧 #

先把Velocity渲染后的HTML代码复制出来，放到浏览器里打开——如果浏览器里样式正常，那问题肯定出在邮件客户端的兼容性上；如果浏览器里也不正常，那就是Velocity模板的渲染逻辑有问题，需要检查变量或语法是否写错。

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