属性前缀:通过添加前缀的方式可以让浏览器率先支持新的属性。
1、常用的属性前缀
- -webkit:webkit核心浏览器,包括Chrome、Safari等。
- -moz:火狐(Ferefox)浏览器。
- -ms:IE浏览器。
- -o:Opera浏览器。
注:在实际的开发中,对于大多数的CSS3效果来说,考虑到兼容性,往往需要把所有的前缀属性都写上去。相关的示例如下所示:
.transform{
-webkit-transform:rotate(-3deg);
-moz-transform:rotate(-3deg);
-ms-transform:rotate(-3deg);
-o-transform:rotate(-3deg);
transform:rotate(-3deg);
}
2、属性前缀排序
面对一些老版本浏览器的用户时,即使W3C标准得到了一致通过和广泛推广,开发者也不得不继续给代码写上所有的属性前缀。
问题:W3C标准属性在某些情况下与带有前缀的属性具有不同的表现形式。
解决方案:将标准的属性放在最后书写。
原理:即使相关的表现形式不同,后书写的符合W3C标准的属性,会覆盖前面带有属性前缀的定义,更好地保证显示效果在所有的浏览器下保持一致。