背景
在看到一些css源码的时候,发现有些属性前面带有-moz,-webkit等前缀。
-moz-
代表firefox浏览器私有属性
-ms- 代表IE浏览器私有属性
-webkit-代表safari、chrome私有属性
-o- 代表Opera
这样写的目的
- 这些是为了兼容老版本的写法,比较新版本的浏览器都支持直接写:border-radius。
- 现在比较流行的一个概念就是:不太关键的样式,可以不考虑兼容,比如你说的圆角,并不影响内容的显示,如果客户浏览器太旧,就让他看到旧的方形效果就是,一定要看到新效果,只能建议客户升级浏览器。
Tips
- Internet Explorer 9+ 支持 border-radius 和 box-shadow 属性。
- Firefox、Chrome 以及 Safari 支持所有新的边框属性。
- 对于 border-image:Safari 5 以及更老的版本需要前缀 -webkit-。
- Opera 支持 border-radius 和 box-shadow 属性,但是对于 border-image 需要前缀 -o-。