4

我们需要我们的电子邮件在具有 Helvetic Neue 的机器上看起来不错。所以我们的字体栈是:

font-family: 'Helvetica Neue',HelveticaNeue,Helvetica,Arial,sans-serif; 

我们在每个 TD、每个 DIV、每个 TABLE 甚至 BODy 中都有样式声明。尽管如此,当 Outlook 在该列表中找不到第一个字体时,它会中断并默认为丑陋的 Times New Roman - 它不应该遍历字体并显示确实存在的字体(Windows 上的 Arial)吗?

沮丧的是,我们甚至将这些样式声明放在<font>文本周围的丑陋和费力的标签中。任何和所有文本都有这些声明,并且在字体标签的<style>.

Litmus 显示 Outlook 2003、2007 和 2010 在 Windows 上的 Arial 中正确显示这些。

然而,在我们的办公室,所有的人都在 Times New Roman 中收到这些电子邮件。我错过了什么?关于为什么 Outlook 2010(我们使用的版本)将所有内容强制为 Times New Roman 的任何指示或提示?

其他问题,例如这个问题——Outlook 2010 覆盖从 Arial 到 Times New Roman 的字体系列——不回答这个问题。

谢谢!下面是一个代码示例:

`

<table align="center" width="95%" cellpadding="8" cellspacing="8" style="font-family: 'Helvetica Neue',Helvetica,'Arial Unicode MS',Arial,sans-serif;font-size: 14px;color: #999999;border-spacing: 0;border-collapse: collapse;">
      <tr>
      <td height="18" align="center" valign="middle" style="font-family: 'Helvetica Neue',Helvetica,'Arial Unicode MS',Arial,sans-serif;font-size: 14px;color: #999999;border-top: 1px solid #dddddd;border-bottom: 1px solid #dddddd;border-collapse: collapse;">
         <span class="hide-on-small" style="font-family: 'Helvetica Neue',Helvetica,'Arial Unicode MS',Arial,sans-serif; font-size: 14px; color: #999999;  ">Rummy & Bingo Monthly<img src="http://d3cbux4et72c14.cloudfront.net/wtd2/sep.jpg" alt=" - " width="55" height="10" style="border: 0;">  </span>Issue <span style="font-family: 'Helvetica Neue',Helvetica,'Arial Unicode MS',Arial,sans-serif; font-size: 14px; color: #999999;  ">05</span> <img src="http://d3cbux4et72c14.cloudfront.net/wtd2/sep.jpg" alt=" - " width="55" height="10" style="border: 0;"> <span style="font-family: 'Helvetica Neue',Helvetica,'Arial Unicode MS',Arial,sans-serif; font-size: 14px; color: #999999; ">Aug 2013</span>
      </td>
      </tr>
      </table>

`

4

1 回答 1

4

这将解决您的问题:

<style type="text/css">
    table { border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt;}
    table td {border-collapse: collapse;}
</style>
<!--[if gte mso 9]>
    <style>.outlook { font-family: arial, sans-serif; }</style>
<![endif]-->
</head>
<body>

    <table align="center" width="95%" cellpadding="8" cellspacing="8">
        <tr>
            <td class="hide-on-small" align="center" valign="middle" style="border-top: 1px solid #dddddd;border-bottom: 1px solid #dddddd;font-family: 'Helvetica Neue',Helvetica,Arial,sans-serif; font-size: 14px; color: #999999;">
                <span class="outlook">Rummy & Bingo Monthly</span>
        </td>
        </tr>
    </table>
</body>
  • 我删除了您对字体样式声明的不必要的重复。除了 TD 之外,没有必要在任何地方声明它。
  • 我将您的字体样式声明从跨度移动到 TD 以及您的 CSS 类分配“hide-on-small”。

字体样式与专门用于解决 Outlook 问题的字体样式分开。- 在头部,在您可能声明的任何其他 CSS 下方,我添加了一个只有 Outlook 才能读取的条件注释。在此注释中有一个 CSS 类,它将告诉 Outlook 字体是 Arial。因此 Outlook 将完全忽略您使用的字体不可用的事实,从而否定它找到自己替换的任何理由。

此外,拉出您的内联 CSS 边框折叠声明,因为您可以只在头部和正文中声明,为所有表格赋予边框 =“0”的属性。而不是写 style="border-collapse:none;" 十几次或更多次。

于 2013-12-09T02:05:16.667 回答