css3中-moz、-ms、-webkit各什么意思

html-css012

css3中-moz、-ms、-webkit各什么意思,第1张

1、-moz代表firefox浏览器私有属性

2、-ms代表ie浏览器私有属性

3、-webkit代表safari、chrome私有属性

这些是为了兼容老版本的写法，比较新版本的浏览器都支持直接写：border-radius。

现在比较流行的一个概念就是：不太关键的样式，可以不考虑兼容，比如你说的圆角，并不影响内容的显示，如果客户浏览器太旧，就让他看到旧的方形效果就是，一定要看到新效果，只能建议客户升级浏览器。

样式定义了之后，有选择器就直接应用了：

div{

-webkit-animation: case 5s linear infinite

}

这个就是在chrome浏览器中应用的，还有-moz， -o都是不同浏览器下才能识别的。

这样改一下就好

@-webkit-keyframes wave

{

from{-webkit-transform:rotate(30deg)}

to{-webkit-transform:rotate(300deg)}

}

重新检查并修补了下css文件里所有的关于animation的属性，

看来所有针对相关浏览器兼容的代码是必须要同时规范，

例如-webkit-animation后面接的一定是@-webkit-keyframes而不是@keyframes，后面所写的其他动画才会一并生效的。