ipad - 设置 -webkit-perspective 模糊 ipad3 屏幕

Question

在 iPad3 上设置 webkit 透视 CSS 属性会使子元素呈现非常模糊，就像图像在非视网膜显示器上呈现一样。需要明确的是，我不是在谈论渲染模糊的图像，DOM 子元素正在渲染模糊。

对此可以做些什么？

简单地删除该属性不是一种选择，因为我使用需要在 Z 轴上移动的动画。

属性在 CSS 中是这样设置的：

-webkit-perpective: 500;

感谢您对此的任何帮助！

Answer 1

不确定这是否会有所帮助，但是前端大神 David DeSandro 在这篇文章中提到了这种事情，在“返回 Z 轴原点”部分下：

http://24ways.org/2010/intro-to-css-3d-transforms

为了使 3-D 变换保持快速，Safari 会合成元素，然后应用变换。因此，文本的抗锯齿将保持在应用转换之前的状态。在 3-D 空间中向前变换时，可能会出现明显的像素化...

...为了解决我们的#cube 的失真并恢复像素完美，我们可以将 3-D 对象推回，以便将正面定位回 Z 轴原点。

#cube { -webkit-transform: translateZ(-100px); }