在Chrome / Firefox 28+中图像模糊

Question

我正在制作一个网站，有很多css变换(rotate:45deg)，但我有几个问题与模糊文本/图像。

我做了一个例子。 http://jsfiddle.net/4pjsh/

在Chrome中，我添加了"硬件加速"来修复动画期间的闪烁/蹩脚效果，但图像和文本现在总是模糊的。我搜索并尝试了很多东西，但找不到一种方法来让它们干净。

在Firefox 27-中，它工作得很好，但自从mozilla发布Firefox 28/29以来，当块动画时，图像变得模糊。在动画的最后，他们干净的回来了。

有人知道怎么解决这个问题吗?如果可能的话……

谢谢

Answer 1

我删除了所有旋转，并"重新开始"。不管怎么说，我至少在chrome中去掉了模糊。

http://jsfiddle.net/4pjsh/6/

现在，我只是这样旋转:

.gridd .item {
    -webkit-transform: rotate(45deg);
}
.gridd .zonelogo img {
    -webkit-transform: rotate(-45deg);
}
.gridd .item .blockMore p { //You don't need to be this specific
    -webkit-transform: rotate(-45deg)
}

对不起，只有时间做-webkit的:)