css3动画在android和ios浏览器中不起作用

html代码：

.iconItem{显示：内联块；宽度：136px；高度：136px；文本对齐：中心；边距：15px 15px；位置：相对；z索引：0；颜色：#FFF；文本装饰：无；轮廓：无；-webkit点击高亮显示颜色：rgba（0,0,0,0）；}
.itemBg{宽度：100%；高度：100%；背景：rgba（9,52,89,0.3）；位置：绝对；z索引：5；顶部：0；左侧：0；边界半径：100%；过渡：所有0.4缓进-缓出；}
.itemText{宽度：100%；位置：绝对；z索引：15；顶部：87px；左侧：0；文本对齐：中心；}
.iconItem:hover.itemBg.itemRotate{background:url(http://trtesth5.wlb.pw/wlb_m/images/bg_rotate.png)不重复0；
-webkit动画：myrotate 2s线性无限运行；
-moz动画：myrotate2s线性无限运行；
动画：myrotate 2s线性无限运行；
}
@-webkit关键帧myrotate{
0%{-webkit变换：旋转（0度）；}
100%{-webkit变换：旋转（360度）；}
}
@-moz关键帧myrotate{
0%{moz变换：旋转（0度）；}
100%{moz变换：旋转（360度）；}
}
@关键帧myrotate{
0%{变换：旋转（0度）；}
100%{变换：旋转（360度）；}
}

---

使用带前缀的关键帧并不意味着正在设置动画的特性应该具有相同的前缀，或者不带前缀的关键帧不需要具有带前缀的变换。