google-chrome - 谷歌浏览器文本阴影渲染

Question

谷歌浏览器在其 CSS3 文本阴影的实现中有一个非常烦人的缺陷。应用文本阴影时，子像素抗锯齿将关闭。再多的 -webkit-font-smoothing 也无法说服它。粗糙的 alpha channel 抗锯齿导致阴影与字母混合，这与像素化文本一起最终产生非常丑陋的外观。如果使用手写字体(例如 Monotype Corsiva http://www.newfonts.net/index.php?pa=show_font&id=130)，这一点会更加明显。

您可以在 Twitter 上清楚地看到这一点 - http://dev.twitter.com/pages/auth . text-shadow 用于文本轮廓:在 Chrome 中查看页面，与 FF 或 IE 比较，你会发现它有多糟糕。

对于较小的文本，效果会变得更糟，直到它完全无法阅读。此处提供了对该问题的技术讨论:http://www.google.com/support/forum/p/Chrome/thread?fid=5d1c0f2082af0f21000483e9a516d36e&hl=en

Chromium 元素中提交了一个错误(问题 23440)。这个错误已经存在一年多了，仍然没有分配给任何人。谷歌开发人员看到了它，认为它不那么重要并让它老化。事实证明，他们只修复了“流行”的错误，这种做法非常蹩脚，但看起来令人印象深刻!我对 Chrome 非常失望!网络排版和 CSS3 每天都被越来越多的人使用，使网络变得更加美丽!很遗憾存在这样的问题来减慢速度。

因此，需要公共(public)努力来解决这个问题。告诉别人这件事，写在你的博客上。你可以去http://code.google.com/p/chromium/issues/detail?id=23440并对该问题进行投票。您可以通过点击位于页面左上角的星号来完成此操作(需要某种类型的 Google 帐户 - gmail 等)。

为了让事情更清楚 - 我的问题有两个目标:

1. 找到技术解决方法。
2. 让 Google 修复 Chrome 中的问题。

我会对发布到有关该问题的文章的每个链接进行投票，并将最佳技术解决方案或公共(public)努力标记为已接受。

Answer 1

@sebastian's fix可能不适用于旧版本的 Chrome。
Iron Browser (Chromium fork) v3.0.197.0 下截图:

所有被分配阴影的看起来都一样，-webkit-font-smoothing 和 -webkit-text-stroke 一样没有效果。

相反，我一直在试验，直到我想出这个修复:http://jsbin.com/acalu4

tldr:在其他阴影之前添加一个无害的 0 0 0 transparent,。

已知问题:一些浏览器只能处理 1 个 text-shadow。为了不影响它们(杀死它们唯一的影子)，这应该通过 javascript 仅应用于 Chrome。