【原】常见CSS3属性对iosandroidwinphone的支持

那么，除了ios和android系统之外，还有哪个移动设备的操作系统是我们需要考虑进来的呢？可能大家会在猜是winphone，没错！就是微软发布的一款手机操作系统Windows Phone，虽然用户不算太多，但是这部分用户也是我们需要考虑到的，至少要保证网页在winphone的展现是正常的。目前winphone有几个版本，主要是Windows Phone 7 和Windows Phone 8，其对应的浏览器分别是IE9和IE10。那么，webapp开发中除了兼容ios3.0~7.0，android2.1~4.2，还要兼容的是IE9~11。

近期在研究css3的性能，顺手也整理了常见CSS3属性对ios&android&winphone支持，今天分享给大家，如下：

√：完全支持 √：部分支持 ×：不支持 (-webkit)：添加-webkit前缀才支持 (-ms)：添加 -ms前缀才支持

总结

对于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\0;}

上述可知，在Webapp开发中，我们可以把移动设备分为低端系统(IE9、android2.1~3.0、ios3.2)和高端系统(ios4+、android4.1~4.2)，针对低端系统，采用普通方案，并使用hack兼容，针对高端系统，可以采用更丰富更炫酷的效果。移动设备更新换代的很快，目前各种手机的最新版本系统已经支持css3的大部分效果，相信在未来对css3的支持可以达成统一。

关于Webapp开发的兼容处理，可以参考如下的文章：

【原】webapp开发中兼容Android4.0以下版本的css hack

【原】使用iScroll.js解决ios4下不支持position:fixed的问题

【原】[webkit移动开发笔记]之兼容iPhone4和iPhone5的方法

【原】欺骗浏览器的CSS（最新兼容）一直更新

作者：白树

出处：http://peunzhang.cnblogs.com/

【原】常见CSS3属性对iosandroidwinphone的支持相关推荐

calc ie支持_让IE6/IE7/IE8支持CSS3属性的8种方法介绍
让IE6/IE7/IE8支持CSS3属性的8种方法介绍发布时间:2013-09-23 10:43:06 作者:佚名我要评论 IE浏览器暂不支持CSS3的一些属性.国外的工程师们,不安于此现 ...
JS判断浏览器是否支持某一个CSS3属性
1.引子 css3的出现让浏览器的表现更加的丰富多彩,表现冲击最大的就是动画了,在日常书写动画的时候,很有必要去事先判断浏览器是否支持,尤其是在写CSS3动画库的时候.比如transition的ani ...
让IE6/IE7/IE8浏览器支持CSS3属性
一.下载搜索下载:ie-css3.htc,它是让IE浏览器支持CSS3表现的关键. 二.上面的是什么东西首先说说.htc文件,.htc文件是个脚本文件,个人以为与js文件属于同一货色,只是呢,貌似 ...
低版本浏览器使用最新渲染模式以免IE不支持CSS3属性
1.让IE使用最新的渲染模式,告诉低版本浏览器使用最新渲染模式以免IE不支持CSS3属性 <meta http-equiv="X-UA-Compatible" content ...
CSS3属性border-radius参数详解
border-radius,国内翻译成圆角,你可能以为这个属性就是用来画圆角,没错,但是除此之外,它还可以做点别的事情.radius其实指的是边框所在圆的半径,这个CSS3属性不仅能够创建圆角,还可以 ...
html5文字特效教程视频,IT兄弟连 HTML5教程 CSS3属性特效自定义文字
原标题:IT兄弟连 HTML5教程 CSS3属性特效自定义文字字体使用是网页设计中不可或缺的一部分.经常地,我们希望在网页中使用某一特定字体,但是该字体并非主流操作系统的内置字体,这样用户在浏览页 ...
【04】HTML5+CSS3：01-HTML5新增标签、多媒体标签、input标签、新增表单属性、CSS3属性选择器、伪元素选择器、2D转换
文章目录 HTML5 第一天一.什么是 `HTML5` 二.`HTML5 ` 新增标签三.多媒体音频标签四.多媒体视频标签五.新增 input 标签六.新增表单属性七.`CSS3 ` 属性 ...
Android常见XML属性解析
常见XML属性解析属性描述 android:id android:id的设置,通常有三种方式,详见下文 android:layout_width 控件宽度 android:layout_heigh ...
html+not选择器,CSS3属性选择器与(:not)选择器_html/css_WEB-ITnose
一:css3属性选择器: img[alt]{ border:2px dashed #000;} 这个选择器会匹配页面标签中任何一个含有alt属性的图片标签. 还可以通过设定属性值来缩小匹配范围:如下代 ...

【原】常见CSS3属性对iosandroidwinphone的支持

【原】常见CSS3属性对iosandroidwinphone的支持相关推荐

最新文章

热门文章