h5做移动应用开发部分技巧
1、使用多种分别率设备:利用viewport标签
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
2、删除默认的苹果工具栏和菜单栏,如手机号自动加下划线:
<meta name="apple-mobile-web-app-capable" content="yes">
content有两个值”yes”和”no”,当我们需要显示工具栏和菜单栏时,这个行meta就不用加了,默认就是显示。
3、控制苹果手机状态栏样式:<meta name="apple-mobile-web-app-status-bar-style" content="black">
4、当你触摸并按住触摸目标时候,禁止或显示系统默认菜单。
-webkit-touch-callout 是一个 不规范的属性(unsupported WebKit property),它没有出现在 CSS 规范草案中。
在iOS上,当你触摸并按住触摸的目标,比如一个链接,Safari浏览器将显示链接有关的系统默认菜单。这个属性可以让你禁用系统默认菜单。
*{-webkit-touch-callout:none;}
5、CSS里的user-select属性用来禁止用户用鼠标在页面上选中文字、图片等,也就是,让页面内容不可选,使更像原生应用:
*{-webkit-user-select:none;}
6、防止出现点击页面元素出现闪一下黑色的现象:
*{-webkit-tap-highlight-color:rgba(255,255,255,0)}
7、滑动更流畅
-webkit-overflow-scrolling: touch
overflow-scrolling: touch
h5做移动应用开发部分技巧的更多相关文章
- iOS开发实用技巧—Objective-C中的各种遍历(迭代)方式
iOS开发实用技巧—Objective-C中的各种遍历(迭代)方式 说明: 1)该文简短介绍在iOS开发中遍历字典.数组和集合的几种常见方式. 2)该文对应的代码可以在下面的地址获得:https:// ...
- 10个Visual Studio原生开发调试技巧
10个Visual Studio原生开发调试技巧(1) 2013-05-29 13:30 佚名 开源中国 我要评论(1) 字号:T | T 以下的列表中你可以看到写原生开发的调试技巧(接着以前的文章来 ...
- 移动平台3G手机网站前端开发布局技巧
本文转载至:移动平台3G手机网站前端开发布局技巧汇总 - 前端开发-武方博 您或许正在或准备参与一个WepApp项目,您或许正在Google搜索mobile development相 关的文章,您或许 ...
- 移动平台3G手机网站前端开发布局技巧汇总
移动平台3G手机网站前端开发布局技巧汇总 作者:前端开发-武方博 发布:2011-05-10 09:11 分类:移动开发 阅读:120,618 views 7条评论 您或许正在 ...
- iOS之H5和Native混合开发
今天需要用到一个H5和Native 混合开发的项目,简单的写一点入门的东西,很简答: 先介绍一下简单的配置步骤: 1.新建项目:SB拖一个UIWebView 按住Ctrl 拖线delegate 设置为 ...
- TP开发小技巧
TP开发小技巧原文地址http://wp.chenyuanzhao.com/wp/2016/07/23/tp%E5%BC%80%E5%8F%91%E5%B0%8F%E6%8A%80%E5%B7%A7/ ...
- 移动Web开发小技巧
移动Web开发小技巧 添加到主屏后的标题(IOS) name="apple-mobile-web-app-title" content="标题"> 启用 ...
- Linux c c++ 开发调试技巧
看到一篇介绍 linux c/c++ 开发调试技巧的文章,感觉挺使用,哪来和大家分享. 通向 UNIX 天堂的 10 个阶梯Author: Arpan Sen, 高级技术人员, Systems Doc ...
- BizTalk开发小技巧
BizTalk开发小技巧 随笔分类 - Biztalk Biztalk 使用BizTalk实现RosettaNet B2B So Easy 摘要: 使用BizTalk实现RosettaNet B2B ...
随机推荐
- MAC 使用技巧及常用软件备忘
公司转向MAC快一年, 换了MAC PRO半年时间,MAC这东西除了颜值和性能,软件真是不如WINDOWS啊,不是没有,只是好多都收费! 先介绍几个跨平台的. WIN+MAC 通用: 浏览器: CHR ...
- 使用curl向Solr导入json文件(Windows、Linux均可)
Linux环境下: 1.进入需要导入的文件所在路径 2.执行: curl "http://IP:8983/solr/目标集合名/update?commit=true" --data ...
- 安装SpringExt以查看schema文件
安装SpringExt以查看schema文件 学习了:https://blog.csdn.net/ltianchao/article/details/43565167 spring ext啊 mvn ...
- 怎么成为PHP专家
当阅读各种和PHP相关的博客.Quora问题.Google+社区.资讯和杂 志的时候,经常会注意到在技术上出现两极分化的现象.问题均围绕在“我如何连接到一个MySQL数据库?”,或者是“我如何使得邮件 ...
- Oracle database wrc运行报错ORA-15557
[oracle@host capture]$ wrc system/oracle@db1 REPLAYDIR=/home/oracle/cap_dir/ Workload Replay Client: ...
- c和c++在windows下获取时间和计算时间差的方法总结
c/c++在windows下获取时间和计算时间差的几种方法总结 一.标准C和C++都可用 1.获取时间用time_t time( time_t * timer ),计算时间差使用double diff ...
- HDU - 3038 How Many Answers Are Wrong (带权并查集)
题意:n个数,m次询问,每次问区间a到b之间的和为s,问有几次冲突 思路:带权并查集的应用.[a, b]和为s,所以a-1与b就能够确定一次关系.通过计算与根的距离能够推断出询问的正确性 #inclu ...
- UE4 场景展示Demo
使用到的level blueprint如下:
- 在Gridview中输入小数时报对于int32 太大或太小
使用Datagridview绑定Access数据库,对于数字类型的数据输入小数后报以下错误: 根据错误判断应该是自动检测该栏位应该输入int32类型的数值.我在数据库中定义了保留4位小数,为什么还被转 ...
- Android ListView工作原理全然解析,带你从源代码的角度彻底理解
转载请注明出处:http://blog.csdn.net/guolin_blog/article/details/44996879 在Android全部经常使用的原生控件其中.使用方法最复杂的应该就是 ...