css3在不一樣型號手機瀏覽器上的兼容一覽表

 

 

網上搜集了css3對不一樣系統手機瀏覽器的支持狀況(ios/android/winphone)備份一下以便查看.  如下資料由微信產品部"白樹"整理, 轉載請註明.

√：徹底支持   √：部分支持   ×：不支持   (-webkit)：添加-webkit前綴才支持   (-ms)：添加 -ms前綴才支持
 

css3總結: 

對於webkit內核的瀏覽器, 除media、text-shadow外，使用其它屬性基本上要加上webkit前綴. 

gradient在低版本的系統中渲染效果不豐富

ios3.2~4.3不支持position:fixed，不推薦使用

android2.1~2.3對動畫的支持效果不豐富

android2.1~2.3不支持translate3d，能夠利用它結合media寫低端android版本的css hack

對於winphone的IE瀏覽器

IE9~11支持media、box-shadow、border-radius

IE9對動畫不支持

IE9不支持box佈局

IE9不支持漸變，看具體狀況可適當使用IE濾鏡

僅支持IE9的寫法：{屬性：屬性值9;}

上述可知，在Webapp開發中，咱們能夠把移動設備分爲低端系統(IE九、android2.1~3.0、ios3.2)和高端系統(ios4+、android4.1~4.2)，

針對低端系統，採用普通方案，並使用hack兼容，針對高端系統，能夠採用更豐富更炫酷的效果。

移動設備更新換代的很快，目前各類手機的最新版本系統已經支持css3的大部分效果，相信在將來對css3的支持能夠達成統一。