Question

为啥CSS3 animation在chrome下可以，Safari不可以

Answer 1

animation是css3的新属性，尚处于实验阶段，各种不同内核的浏览器都在进行试验中，也就是说animation在不同的浏览器中其支持程度、运行效果等方面是存在差别的，因此为了保证网页在各种浏览器中的兼容性，就要给animation添加各种浏览器特有的前缀，比如说 -webkit-animation 只有webkit内核的浏览器才能识别并执行，其他则会自动忽略。 目前，IE10+、Firefox 以及 Opera 都已支持标准的 animation 属性，而 Safari 和 Chrome（它们都是webkit内核）则只支持 -webkit-animation 属性，所以你的代码简写成以下即可： -webkit-animation: animations 2s ease-out 1s backwards; animation: animations 2s ease-out 1s backwards;