网上搜集了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. NSDate 格式化 NSDate to NSString

    NSLog(@"%@",[NSDate stringFromDate:[NSDate date] withFormat:@"yyyyMMdd__HH_mm_ss_zzz& ...

  2. PHP isset() 检测变量是否设置

    isset() 用于检测变量是否设置. isset() PHP isset() 用于检测一个或多个变量是否设置,如果被检测的变量存在则返回 TRUE,否则返回 FALSE. 语法: 1 bool is ...

  3. BIEE 目录迁移(文件夹)方式

    文件夹迁移方式一(归档--取消归档):     归档:analytics中选择目录,定位至指定文件夹,更多中选择归档,保存为 .catalog文档:     释放归档: 进入目录管理器,离线方式登陆, ...

  4. Sql Server之旅——第四站 你必须知道的非聚集索引扫描

    非聚集索引,这个是大家都非常熟悉的一个东西,有时候我们由于业务原因,sql写的非常复杂,需要join很多张表,然后就泪流满面了...这时候就 有DBA或者资深的开发给你看这个猥琐的sql,通过执行计划 ...

  5. mod_PHP&fastcgi

    从宏观上来看,PHP内核的实现与世界上绝大多数的程序一样,接收输入数据, 做相应处理然后输出(返回)结果. 我们编写的代码就是PHP接收的输入数据,PHP内核对我们编写的代码进行解释和运算, 最后返回 ...

  6. 0012 win7x64安装CentOS7

    00 准备工作 到VirtualBox官网下载Oracle VM VirtualBox 5.1.8:https://www.virtualbox.org/wiki/Downloads 到centos官 ...

  7. 手写一个json格式化 api

    最近写的一个东西需要对json字符串进行格式化然后显示在网页上面. 我就想去网上找找有没有这样的api可以直接调用.百度 json api ,搜索结果都是那种只能在网页上进行校验的工具,没有api. ...

  8. [Java入门笔记] Java语言简介

    前言 学习Java有一段时间了,但是一直缺少一个系统的思想,现在重新通过书籍中.网上的文章,视频等资料,整理与回顾Java的知识点. 言归正传,让我们先从了解Java语言开始. Java语言的由来 J ...

  9. 如何编译ReactNative示例程序Examples

    通过示例程序可以看到一些基本组件的使用,对于学习ReactNative是很有帮助的. 编译示例程序需要将整个项目导入到androidStudio中,androidStudio导入项目时选择react- ...

  10. Python基础-day2

    1.Python模块python 中导入模块使用import语法格式:import module_name示例1: 导入os模块system('dir')列出当前目录下的所有文件 # _*_ codi ...