CSS3 rotateX创建一个行

这是为什么白线可见？它实际上并不是白色的，而只是显示网站的背景，它恰好是白色的。

当旋转div使用背景图像而不是颜色时，不会发生这种情况。

使用这个应用旋转：

$('.box').css('transform', 'translateZ(-'+halfHeight+'px) rotateX('+ deg +'deg)')

2016-10-02 Alvaro

感觉就像一个浏览器神器更多阅读。这肯定不会发生在我的电脑上（Windows 10上的Firefox 49 x64） –

在Chrome（Windows）53.0.2785.116上也不会发生这种情况。 – JuniorDev

感谢您的评论！ – Alvaro

这是与图形渲染的一个问题。而且，它在所有电脑上都不一样。

我的建议，而不是使用translateZ()使用translate3d()，这将使用GPU时可用和动画将光滑，没有任何帧丢弃。

2016-10-02 15:31:34

是的，我可以分别替换'translate3d'和'rotate3d'的'transladeZ'和'rotateX'，但这无法解决问题。 https://jsfiddle.net/98otxxwm/14/ – Alvaro

@Alvaro它会迫使系统使用GPU而不是CPU，这可能会修复这个 –

只是一个笔记... translateZ启用3d引擎。 Z轴位于三维空间中。 – AA2992

回答