CSS兼容性详解

对于前端工程师来说，不想面对又不得不面对的一个问题就是兼容性。在几年之前，处理兼容性，一般地就是处理IE低版本浏览器的兼容性。而近几年，随着移动端的发展，工程师也需要注意手机兼容性了。本文将详细介绍CSS兼容性

【宽高width/height】

【内边距padding】

【边框border】

【外边距margin】

【轮廓outline】

【box-sizing】

　　[注意]只有firefox支持padding-box属性值

【display】

　　[注意]IE7-浏览器不支持table类属性值

【浮动】

【定位】

　　[注意]IE6-不支持固定定位position:fixed

【溢出相关】

【flex】

【多列布局】

【grid】

【字体font】

【首行缩进text-indent】

【对齐】

　　[注意]IE7-浏览器中vertical-align的百分比值不支持小数行高

【间隔】

【大小写text-transform】

【划线text-decoration】

【空白符white-space】

　　[注意]IE7-浏览器不支持pre-line和pre-wrap这两个属性值

【换行】

　　[注意1]W3C建议使用overflow-wrap替换word-wrap

　　[注意2]移动端目前基本都不支持word-break的属性值keep-all　

【文本方向】

【文本溢出text-overflow】

【文本阴影text-shadow】

【背景background】

【前景和透明度】

【颜色模式】

　　[注意]IE7-不支持color:transparent，但支持background-color: transparent和border-color: transparent

【光标cursor】

　　[注意]IE7-不支持拓展样式

【过渡transition】 

【变形transform】

【渐变gradient】

【动画animation】

【混合模式】

【滤镜filter】

【倒影box-reflect】

　　只有chrome和safari浏览器支持，且需要添加-webkit-前缀

【will-change】

【表格】

【分页】

【选择器】

【伪类】

【伪元素】

【关键字】

【calc】　

　　[注意]android4.4-4.4.4只支持加法和减法。IE9不支持用于backround-position

【单位】

本文转自  zddnd   51CTO博客，原文链接:http://blog.51cto.com/13013666/1949225