移动web开发经验总结

1、-webkit-tap-highlight-color:rgba(255,255,255,0)可以同时屏蔽ios和android下点击元素时出现的阴影。备注:transparent的属性值在android下无效。

2、-webkit-appearance:none可以同时屏蔽输入框怪异的内阴影。
3、-webkit-transform:translate3d(0, 0, 0)在ios下可以让动画更加流畅(这个属性会调用硬件加速模式),但是在android下不可乱用,很多见所未见的bug就是因为这个。
4、@-webkit-keyframes可以预定义很多你所想到的动画,然后通过-webkit-transition来调用。
5、-webkit-background-size可以做高清图标,不过一些低版本的android只能识别background-size,所以有必要两个都要写上;用这个属性的时候推荐树勇cover这个值,可以自动去匹配宽和高。
6、text-shadow多用这个属性,可以美化文字效果。
7、border-radius、box-shadow、gradient、border-image,不解释,可以精简代码。
8、android、ios4及以下,固定宽/高块级元素的overflow:scroll/auto失效,属于浏览器的bug,可借助第三方工具实现。
9、ios5+可以通过scrollTo(0,0)来自动隐藏浏览器地址栏。
10、<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, width=device-width">width可是宽度,initial-scale初始化缩放比例,maximum-scale允许用户缩 放的最大比例,minimum-scale允许用户缩放的最小比例,user-scalable是否允许用户缩放。

11、允许用户添加到主屏幕,并提供webapp的支持。

12、css3动画会影响你的自动聚焦,所以自动聚焦要在动画执行之前来做,或者直接舍弃。

13、使用media query适配不同屏幕。

14、如果涉及较多域外链接,DNS Prefetching可以帮你做DNS预解析。

15、如果你希望你的站点更多地在SNS上传播,那么Open Graph Protocol会比较适合你。

16、当用iScroll时候,不能使用:focus{outline:0}伪类,否则滑动会卡。

移动web在ios和android下点击元素出现阴影问题的更多相关文章

  1. 同时屏蔽ios和android下点击元素时出现的阴影

    在ios4+和android2+系统,当手指触摸屏幕a标签链接或按钮时,会产生不同的效果,对于ios点击元素的时候,就会出现一个半透明的灰色背景:对于android则出现红色的边框.对这2个系统自带的 ...

  2. 时屏蔽ios和android下点击元素时出现的阴影

    -webkit-tap-highlight-color -webkit-tap-highlight-color:rgba(255,255,255,0)

  3. char的定义在iOS和Android下是不同的

    char is different in iOS and Android!跨平台开发时很容易忽略的非常坑爹的一个区别. 我的需求是实现一个算法,这个算法在iOS和Android下需要保持一致的结果,很 ...

  4. cocos2d-x在win32和iOS、android下获取当前系统时间的方法

    最近在游戏里要显示当前系统时间的功能,网上一搜很多写着获取的方法,大都是如下 struct cc_timeval now; CCTime::gettimeofdayCocos2d(&now, ...

  5. ios和android适配问题总结

    _________________________________________________________________________________ 相关知识点 移动端. 适配(兼容). ...

  6. ios和android适配

    一些情况下对非可点击元素如(label,span)监听click事件,ios下不会触发 解决方案:css增加cursor:pointer; 三星手机遮罩层下的input.select.a等元素可以被点 ...

  7. html5图片上传时IOS和Android均显示摄像头拍照和图片选择

    最近在做信开发时,发现<input type="file" />在IOS中可以拍照或从照片图库选择,而Android系统则显示资源管理器,无拍照选项,网上查找资料,改为 ...

  8. 移动平台前端开发总结(ios,Android)

    首先我们来看看webkit内核中的一些私有的meta标签,这些meta标签在开发webapp时起到非常重要的作用 <meta content="width=device-width; ...

  9. ASP.NET MVC Filters 4种默认过滤器的使用【附示例】 数据库常见死锁原因及处理 .NET源码中的链表 多线程下C#如何保证线程安全? .net实现支付宝在线支付 彻头彻尾理解单例模式与多线程 App.Config详解及读写操作 判断客户端是iOS还是Android,判断是不是在微信浏览器打开

    ASP.NET MVC Filters 4种默认过滤器的使用[附示例]   过滤器(Filters)的出现使得我们可以在ASP.NET MVC程序里更好的控制浏览器请求过来的URL,不是每个请求都会响 ...

随机推荐

  1. WPF后台设置xaml控件的样式System.Windows.Style

    WPF后台设置xaml控件的样式System.Windows.Style 摘-自 :感谢 作者: IT小兵   http://3w.suchso.com/projecteac-tual/wpf-zhi ...

  2. C#基础--之数据类型

    C#基础--之数据类型 摘自:http://www.cnblogs.com/tonney/archive/2011/03/18/1987577.html 在第一章我们了解了C#的输入.输出语句后,我这 ...

  3. 根据Expander的IsExpanded属性值的变化动态设计Control的size

    简要说明: 当Expander 的IsExpanded属性为“True” 时给控件设个尺寸(此处为高度),当为“False”时给控件设另外一个值. 知识点:数据绑定.Style和Trigger < ...

  4. C#怎样处理xml文件的大于号和小于号等常用符号(xml符号引发的程序错误)

    在程序中由xml配置而成的sql语句要转换为C#支持的sql语句 <settings> <select> a.*</select> <from> (se ...

  5. Jquery 前端模版

    <div id="div_demo"></div><script id="demo" type="text/x-jque ...

  6. kFreeBSD 7.0于2013/05/04发布 桌面环境 GNOME 3....

    kFreeBSD 7.0于2013/05/04发布 桌面环境 GNOME 3.4, KDE 4.8.4, Xfce 4.8, and LXDE

  7. ahjesus 捕获entity framework生成的sql语句

    网上这方面的资料很少,找到一个可以用的 http://code.msdn.microsoft.com/EFProviderWrappers 里面有dll可以下载,有教程,不过是E文的. 在Entity ...

  8. Metronic 使用到的开源插件汇总

    Metronic 是一套完整的 UI 模板,但不仅仅是模板,更应该说是一个 UI 框架.它除了提供了大量网页模板,也提供了非常多的 UI 组件,并且应用了众多 jQuery 插件.通过这些资源的整合, ...

  9. Android应用开发基础之九:内容提供者(ContentProvider)

    内容提供者 应用的数据库是不允许其他应用访问的 内容提供者的作用:就是让别的应用访问到你的数据库 自定义内容提供者,继承ContentProvider类,重写增删改查方法,在方法中写增删改查数据库的代 ...

  10. winform(进程和线程)

    一.进程:需要有用Process类用法一:Process.Start("calc");(不好用)该方法弊端:有许多程序不知道它的运行名字到底是什么,如果写错了,就会出现程序崩溃错误 ...