当我指定无衬线字体时，如何停止 Yahoo 在 HTML 电子邮件中显示衬线字体？答案

【问题标题】：How do I stop Yahoo displaying serif fonts in HTML emails when I've specified sans-serif?当我指定无衬线字体时，如何停止 Yahoo 在 HTML 电子邮件中显示衬线字体？
【发布时间】：2011-07-28 16:30:58
【问题描述】：

我整理了一封 HTML 电子邮件。我们这里的一些人一起知道如何很好地做到这一点（表格、内联样式等），并且它可以在多种浏览器以及 Outlook、Google 和 Hotmail 中完美显示。

但是，雅虎是另一回事。当我们指定无衬线字体时，所有文本都以衬线字体显示。下面是一个 sn-p 代码示例，说明它是如何完成的：

<tr>
  <td colspan="2" width="600px" style="padding: 15px 0 15px 0; font-family:arial,sans-serif; font-size:40px; color:#0066cc;">
    Some text in here
  </td>
</tr>

我们尝试过使用 标签并在其中设置样式，也尝试过，但这些似乎都不起作用。

有没有人有类似的经历和/或更重要的是，是否有任何 HTML 电子邮件专家知道如何解决此问题？

【问题讨论】：

你试过“font-family:sans-serif !important”吗？

标签： html email fonts yahoo

【解决方案1】：

首先要查看的是 Yahoo 为您的网络浏览器提供的 HTML。如果他们真的修改了 HTML，你会得到答案。

否则，它可能是在他们自己的样式表中定义为“！important”的 CSS 规则。如果是这种情况，那么font-family:sans-serif !important 可以解决您的问题。

【讨论】：

【解决方案2】：

事实证明，雅虎邮件的字体看起来非常奇怪。根据我的经验（和最近的测试），您似乎需要仅使用标签的face属性，而不在标签内使用font-family内联样式。

例如，以下代码在 Yahoo 中生成带有衬线的文本：

Text

但下一个示例可以正常工作，根据需要修改字体

Text

后者在 Gmail、Hotmail 和 Outlook 2010 中也是一致的（可能还有其他，这些只是我测试过的）

祝你好运！

【讨论】：

【解决方案3】：

我刚刚通过 Yahoo 运行了您的示例：

  <!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">
    <head>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
      <title>Untitled Document</title>
    </head>
  <body>
    <table>
      <tr>
        <td colspan="2" width="600px" style="padding: 15px 0 15px 0; font-family:arial,sans-serif; font-size:40px; color:#0066cc;">
      Some text in here
        </td>
      </tr>
    </table>
  </body>
  </html>

而且它是无衬线渲染...唯一不正确的是 TD 的宽度属性上的“px”。

也许您的代码中有一些导致此问题的严重错误？

【讨论】：