html - 如何禁用先前定义的 CSS 类中定义的颜色

Question

最近在编写代码和 HTML 电子邮件时，我注意到 Yahoo!开始劫持某些链接和关键字，添加 <span class='yshortcuts'>这会改变文本和链接的颜色，这可能会导致一些非常糟糕的渲染问题。

Yahoo! 的“修复” suggested 非常难看(在所有受影响的链接和关键字中添加一个 span)- 远非一个简单的通用解决方案，尤其是当他们将样式应用于看似任意的文本时。

我想知道是否有可能简单地超越他们的类(class)，以及如何使用 css 删除 color属性。 (尽管并非所有主要电子邮件平台都支持 <style> block ，但 Yahoo! 支持……以及不支持它的平台，优雅地忽略它。)

有点像 <style> .yshortcuts{color:none;} </style>

我知道 color:none;无效，并且不能普遍使用。

有什么想法吗？

Answer 1

经过挖掘和研究，这似乎是解决问题的最佳方法(在我看来)。

1. 在电子邮件顶部，添加此样式 block 。这将解决大多数浏览器中的大部分问题。

   <style>
   .yshortcuts{color:inherit;}
   </style>
   

2. 因为我们希望 IE 用户也快乐，所以在每个 <a> 中插入一个带有颜色样式的跨度。这导致了问题。例如:

   <a href="http://google.com" style="#c912dc"><span style="#c912dc">Google</span></a>
   

这应该在几乎所有情况下修复它。

因为如果您有一个已经编码的文件，手工操作可能会很痛苦，您可以执行正则表达式查找/替换，它应该有助于加快速度(但您的里程可能会有所不同......在 Textmate 中工作):

查找:

(<a[^>]*style=".*color:#(\w{6}).*".*>)(.+)(</a>)

替换:

$1<span style="color:#$2;">$3</span>$4