CSS 转换(旋转)文本在 Chrome 和 Firefox (Windows) 中看起来没有消除锯齿

Question

如果我对文本应用旋转，它不会在 Firefox 和 Chrome(仅在 Windows)中呈现消除锯齿，但它在 IE 中正确呈现。此外，它可以在 Mac OS X 的 Chrome 和 Firefox 中正确呈现。

以下是在我的 Windows 8 中比较三种浏览器的屏幕截图:

http://d.pr/i/9qeg ( Chrome )

http://d.pr/i/r8i0 (火狐)

http://d.pr/i/crZ7 (IE10)

上面的CSS转换很简单

transform: rotate(-1.5deg) translateY(-2px);

这是一个 fiddle :

http://jsfiddle.net/sa6Nb/2/

有什么想法吗？

Answer 1

Updated Fiddle

transform: translate3d(0, 0, 0);

您可以尝试使用 translate3d。据我所知，它会触发元素渲染过程的硬件加速。你可以看到 fiddle 的区别(至少在 chrome 中)