时间戳

首页 > 解决方案 > Outlook HTML 签名格式

html - Outlook HTML 签名格式

问题描述

我目前正在为 Outlook 制作一个 html 签名。我正在努力让它正确格式化并让它在多个设备上看起来都一样。

当我在浏览器上查看 html 时，它看起来完全符合我的设想。我希望应该代表徽标的左行具有完全相同的宽度。我通过使用 text-justify:distribute 来做到这一点。Outlooks 古代渲染引擎可能不支持这一点。有谁知道实现这种效果的支持方式？我尝试过使用 letter-spacing:xx ，但设备之间的差异太大。

这就是签名应该是这样的：

<html>
<body>
    <table width="380" cellspacing="0" cellpadding="0" style="margin-top:0px; margin-bottom:0px; font-family:arial; color: #231f20; vertical-align:top"">
        <tr>
        <td style="FONT-SIZE: 14pt; border-right:#231f20 1.5px solid">
        <span style="white-space:nowrap; font-weight:bold; display: inline-block; text-justify: distribute; text-align-last:justify; letter-spacing:2.7px;">
        <span style="display:block; margin-bottom:4px;">ABCDEF<br></span>
        <span style="display:block; margin-bottom:4px;">GHJKL<br></span>
        <span style="display:block;                   ">MNOPQR</span>
        </span>
        </td>

        <td
            style="font-size:7.5pt; line-height:6pt; vertical-align:bottom; padding-bottom:3px; padding-left:17px">
            <span style="display:block; white-space:nowrap; margin-bottom:0px;">Lorem ipsum dolor sit amet, consetetur sadipscing</span>
            <br>
            <span style="display:block; white-space:nowrap; margin-bottom:0px;">
                Lorem ipsum dolor sit amet, consetetur</span>
            <br>
            <span style="display:block; white-space:nowrap; margin-bottom:0px;">Tel: <a href=""
                    style="text-decoration:none!important; color:#000000">+01 234 56789</a> · <a href="mailto:example.com"
                    style="text-decoration:none!important; color:#000000">www.example.com</a></span>
            <br>
            <span><a href="http://example.com" 
                    style="white-space:nowrap; text-decoration:none !important; color:#000000; font-weight:bold;">www.example.com</a></span>
    </td>
    </tr>
    </table>
</body>
</html>

这是导入到 Outlook 后签名的样子：

标签： htmlcssoutlooksignature

解决方案

嗨 Andre，欢迎来到 Stack Overflow，

对不起，你运气不好。由于不支持该属性，因此您无法在 Outlook 中实现它。字母间距仅在您使用全像素值时才有效，即使如此，它也会因客户端而异。

尽管我很讨厌这样说：如果您想要跨客户端兼容性，您将需要使用图像。您可以使用一个大的并将其按比例缩小以获得良好的外观。

推荐阅读