css - 为什么 css 变换旋转会使文本难看

Question

某些浏览器（对我来说：XP 上的 firefox 和 chrome）似乎没有对带有 CSS 旋转的文本应用抗锯齿

示例：http : //dabblet.com/gist/4281185

为什么它们适用于图像而不适用于文本？

Answer 1

使用 3D 变换。使用 3D 变换属性，即使您实际上没有进行任何 3D 变换也可以提高性能，如下所示：

1. 它将启动 ol' GPU 并获得更流畅的性能。
2. 它会在按钮的默认状态下对文本进行处理（变薄），所以当转换开始时这并不奇怪。

WebKit 有一个讨厌的（我称之为错误），其中正在转换/转换的文本看起来很薄而且很糟糕。默认情况下，文本看起来不错，但当按钮处于过渡或变形时，您会闪烁和变细。

希望这可以帮助。

Answer 2

糟糕的文本质量显然是您使用的网络浏览器的“故障”，但您应该等待一段时间，它应该被修复。随着 Web 开发人员学习如何使用新功能，浏览器程序员必须实现它们，而这需要一些时间才能正常工作。在浏览器的下一个版本中检查它 - 如果文本旋转会越来越多，越来越流行的浏览器会更好地处理它，以正确显示更多网页。