雅虎覆盖 CSS 和内联文本样式答案

【问题标题】：Yahoo overrides CSS and inline styling of text雅虎覆盖 CSS 和内联文本样式
【发布时间】：2014-07-26 05:33:45
【问题描述】：

我正在设计一个目前在除雅虎之外的所有电子邮件客户端中看起来都很好的时事通讯。我已经在样式标签中尝试了内联样式和 CSS，并且同时在两者中进行了尝试。我所做的一切都不会迫使雅虎尊重我的字体/文本样式。一切都默认为 cambria 和 serif，而不是我想要显示的 arial、sansserif。有谁知道解决方法？谢谢。

【问题讨论】：

你试过!important吗？
发布一些代码，以便我们查看您的样式在哪里应用

标签： html css html-email

【解决方案1】：

发布一些代码，以便我们帮助您找到解决方案。

不知道这是否是您的问题，但无论如何我都会发布。雅虎！邮件将呈现仅用于移动设备的媒体查询。如果这是您的问题，这里是您的解决方案：

替换

<style>
  @media only screen and (max-device-width: 480px) {
    #mobileWrapper {width:100% !important}
    .headerText {font-size:24px !important}
  }
</style>

有

<style>
  @media only screen and (max-device-width: 480px) {
    *[id=mobileWrapper] {width:100% !important}
    *[class=headerText] {font-size:24px !important}
  }
</style>

注意这里使用的是 [id or class] 而不是传统的 .class 或 #id。这将迫使雅虎！邮件以正确呈现您的 CSS。希望这是有道理的。

【讨论】：

【解决方案2】：

将!important; 添加到字体声明的末尾。

【讨论】：