网上搜集了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开发中,我们可以把移动设备分为低端系统(IE9、android2.1~3.0、ios3.2)和高端系统(ios4+、android4.1~4.2),

针对低端系统,采用普通方案,并使用hack兼容,针对高端系统,可以采用更丰富更炫酷的效果。

移动设备更新换代的很快,目前各种手机的最新版本系统已经支持css3的大部分效果,相信在未来对css3的支持可以达成统一。

    • 来源:转载
    • 原作者:白树 - http://peunzhang.cnblogs.com/
    • 版权声明:欢迎转载,但请以连接方式备注出处、作者。
    • 本文链接地址:http://www.lao8.org/article_1371/shouji_css3_jianrong
    • 文章名:css3在不同型号手机浏览器上的兼容一览表

css3在不同型号手机浏览器上的兼容一览表的更多相关文章

  1. flex在众多手机浏览器上的兼容方案(亲测华为手机自带浏览器)

    如果项目使用构建工具,可加autoprefixer来处理,[autoprefixer使用指南] 纯手写css兼容代码,需给每个使用的属性加上属性前缀 /*display: flex;写法*/ span ...

  2. 怎么在手机浏览器上访问电脑本地的文件,局域网内,自建WiFi也可以

    首先,电脑要有Mysql+Apache+PHP环境,我直接用Wampsever,开启环境后手机和电脑要再同一个局域网内,然后电脑上打开win+R,输入cmd,再输入ipconfig,就可以看着这台的电 ...

  3. JQuery Mobile 的引用代码,以及在手机浏览器上字体太小的解决办法

    JQuery Mobile 的引用代码: <link rel="stylesheet" href="http://code.jquery.com/mobile/1. ...

  4. 解决UC浏览器或微信浏览器上flex兼容问题

    在UC浏览器上使用display:flex;时会不起作用,要加上兼容性写法,如下 display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */ disp ...

  5. 禁用iPhone手机浏览器上给电话号码自动加上的link样式

    iPhone手机上的浏览器(如Safari),在解析网页的时候会自动给 像是电话号码的数字 加上link样式. 可以添加下面的meta禁用掉这个功能. // //

  6. 禁用iPhone手机浏览器上给电话号码自动加上的link样式(苹果手机自动给手机号加样式)

    原文地址:http://blog.csdn.net/atec2000/article/details/44631633 iPhone手机上的浏览器(如Safari),在解析网页的时候会自动给 像是电话 ...

  7. 解决手机浏览器上input 输入框导致页面放大的问题(记录)

    在微信手机页面开发当中,页面是没有问题的,但是当焦点在input输入框的时候,手机页面会自动放大. 加入以下代码在head 区,可解决此问题 <meta name="viewport& ...

  8. body中设置-webkit-scrollbar竖向滚动条,在手机浏览器上无效

    暂时无解,如果是chrome的PC模式,滚动条是没有的,但如果是手机模式,滚动条会出现,且无法设置其样式,滚完后会自动消失. 如果设置div这些块元素,完全没问题.

  9. 【转】让iframe在iOS设备手机浏览器上支持滚动

    HTML代码 在使用IFRAME或者其他HTML元素时,你需要使用一个元素(如DIV)来包装他们: <div class="scroll-wrapper"> <i ...

随机推荐

  1. jquery.validate 验证机制

    jquery.validate 验证机制 金刚 juqery juqery.validate 在开发系统时,使用了jquery.validate.js 这个验证插件,来校验数据合法性 重点 验证是以i ...

  2. Win8&Win2012R2如何支持DOTA2输入法

    微软自带的拼音和五笔就不用看了,没研究过,下面的方法应该不支持. 其实方法很简单运行下ctfmon.exe就可以了,这个原来旧输入模式的基础,测试可以支持QQ五笔. PS:使用拼音输入法的用户可以直接 ...

  3. 联通烽火hg220桥接tplink路由器

    转载请注明:from http://www.cnblogs.com/juandx/p/5544517.html 1.普通账户:user(7fnmmnml,默认是bdettbr0),猫背后可见 2.工程 ...

  4. 更换mysql数据目录后出现ERROR 2002 (HY000): Can't connect to local MySQL server through socket '/var/lib/mysql/mysql.sock' (2) 的解决办法

    服务器上的mysql默认数据目录为/var/lib/mysql/,同时服务器的/空间不是很大,而近期又有大量的日志需要导入进行分析,时常搞得/的空间捉襟见肘,晚上一狠心就想把mysql的数据目录转移到 ...

  5. javascript-简单工厂两种实现方式

    简单工厂笔记 两种方式: 第一种:通过实例化对象创建 第二种:通过创建一个新对象然后包装增强其属性和功能来实现 差异性:前一种通过类创建的 对象,如果这些类继承同一个父类,他们父类原型上的方法是可以共 ...

  6. iOS MJRefresh下拉刷新(上拉加载)使用详解

    下拉刷新控件目前比较火的有好几种,本人用过MJRefresh 和 SVPullToRefresh,相对而言,前者比后者可定制化.拓展新都更高一点. 因此本文着重讲一下MJRefresh的简单用法. 导 ...

  7. x01.os.16: 添加功能

    准备工作  1.确保是 win xp,如是 win 8,运行 nasm 需按提示同意安装组件.  2.确保 src 和 z_tools 在同一目录下,nasm 已包含在 z_tools 文件夹中.  ...

  8. (转)yii流程,入口文件下的准备工作

    yii流程 一 目录文件 |-framework     框架核心库 |--base         底层类库文件夹,包含CApplication(应用类,负责全局的用户请求处理,它管理的应用组件集, ...

  9. Spring学习之第一个AOP程序

    IOC和AOP是Spring的两大基石,AOP(面向方面编程),也可称为面向切面编程,是一种编程范式,提供从另一个角度来考虑程序结构从而完善面向对象编程(OOP). 在进行 OOP 开发时,都是基于对 ...

  10. Unity Profiler 性能分析

    Profiler窗口 1. CPU A. WaitForTargetFPS:       Vsync(垂直同步)功能所,即显示当前帧的CPU等待时间    B. Overhead:       Pro ...