有没有办法让Chrome能够顺畅地进行字母间距的CSS过渡？

Question

我试图为letter-spacing属性进行一个很好的CSS转换.

它在Firefox和Internet Explorer 10中看起来很棒(有些东西最终在IE中正常工作.哦,对吧？)

但它在Chrome或Opera中不起作用.在Chrome中,它是一系列抖动,因此它从2px变为1px到0.没有像IE/Firefox那样的平滑像素渲染.

有没有办法让Chrome顺利渲染？

这是一个简单的例子:

p {
    letter-spacing:2px; 
    -webkit-transition: letter-spacing, 1s;
    -moz-transition: letter-spacing, 1s;
    -o-transition: letter-spacing, 1s;
    transition: letter-spacing, 1s;
}
p:hover {letter-spacing:0;}

http://jsfiddle.net/aDhRz/

Answer 1

此问题现已在 Blink（为 Chrome 布局引擎提供支持）中得到修复，但尚未在稳定的 Chrome 中推出。但您可以看到它现在在 Chrome Canary 中运行良好。

在它可供所有人使用之前，我认为如果没有使用canvas. 我们很幸运 Chrome 可以自动更新:)

闪烁修复：http://src.chromium.org/viewvc/blink? view=revision&revision=153727

看来 Google 正在认真对待 Blink 的开发，因为这个 bug 自 2008 年起就存在于 WebKit 中，而且至今仍未修复。

WebKit 错误报告：https://bugs.webkit.org/show_bug.cgi?id =20606