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 ...
随机推荐
- BIO的简单Demo
package jesse.test1; import java.io.BufferedReader; import java.io.IOException; import java.io.Input ...
- QQ和微信凶猛成长的背后:腾讯网络基础架构的这些年
本文来自腾讯资深架构师杨志华的分享. 1.前言 也许没有多少人记得2004年发生的事情.但对于老腾讯来说,14年前的那个日子,2004年6月16日永远难以忘怀.这一天,QQ诞生5年后的腾讯在香港联交所 ...
- PNP管理器简析--基于ReactOS0.33
CSDN上转悠了一圈发现关于PNP管理的文章不多.那就由我献个丑,记录自己对PNP管理器的看法. pnp管理器被描写叙述为向内核和应用程序提供关于设备拔插的通知,凭感觉,pnp管理器应该是个线程函数等 ...
- lua面向对象编程 《lua程序设计》 16章 笔记
Lua中的table就是一种对象,即它拥有状态.拥有独立于其值的标识(self).table与对象一样具有独立于创建者和创建地的征集周期 什么叫对象拥有独立的生命周期? Account = {bala ...
- Android.KungFu手机病毒原理及清理方法
原文链接:http://jingyan.baidu.com/article/363872ec8ad56b6e4ba16fb1.html Android.KungFu手机病毒清理方法 浏览:3333 | ...
- EditPlus设置html和js文件的注释快捷键
EditPlus默认是可以通过快捷键注释html的,格式是 <!-- </label> <label>类型</label> <label> --& ...
- Python 标准库 BaseHTTPServer 中文翻译
Python 标准库 BaseHTTPServer 中文翻译. 注意: BaseHTTPServer模块在Python3中已被合并到http.server,当转换你的资源为 Python3 时 2to ...
- cassandra的primary key, partition key, cluster key,
https://stackoverflow.com/questions/24949676/difference-between-partition-key-composite-key-and-clus ...
- Windows内存管理的方式
一.内存的概念 1. 物理内存:即插在主板上的内存条.他是固定的,内存条的容量多大,物理内存就有多大(集成显卡系统除外). 但是如果程序运行很多或者程序本身很大的话,就会导致大量的物理内存占用,甚至导 ...
- typeof 和 Object.prototype.toString.call 数据类型判断的区别
使用 typeof 来判断数据类型,只能区分基本类型,即 “number”,”string”,”undefined”,”boolean”,”object” 五种. 但 Object.prototype ...