WebApp之Meta标签
<meta name="apple-touch-fullscreen" content="yes">"添加到主屏幕“后,全屏显示 <meta name="apple-mobile-web-app-capable" content="yes" />
这meta的作用就是删除默认的苹果工具栏和菜单栏。content有两个值”yes”和”no”,当我们需要显示工具栏和菜单栏时,这个行meta就不用加了,默认就是显示。 <meta name=”apple-mobile-web-app-status-bar-style” content=black” />
默认值为default(白色),可以定为black(黑色)和black-translucent(灰色半透明)。
注意: 若值为“black-translucent”将会占据页面px位置,浮在页面上方(会覆盖页面20px高度–iphone4和itouch4的Retina屏幕为40px)。 在iOS中有两个meta值,apple-mobile-web-app-capable和apple-mobile-web-app-status-bar-style,这两个会让网页内容以应用程序风格显示,并使状态栏透明。
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"> <link rel="apple-touch-icon-precomposed" href="http://spion.blog.163.com/blog/iphone_milanoo.png" />
说明: 这个link就是设置web app的放置主屏幕上icon文件路径。
图片尺寸可以设定为57*57(px)或者Retina可以定为114*114(px),ipad尺寸为72*72(px) <meta content="telephone=no" name="format-detection" />
<meta content="email=no" name="format-detection" />//将不识别邮箱
告诉设备忽略将页面中的数字识别为电话号码 iOS用rel="apple-touch-icon",android 用rel="apple-touch-icon-precomposed"。这样就能在用户把网页存为书签时,在手机HOME界面创建应用程序样式的图标。
<link rel="apple-touch-icon" href="/static/images/identity/HTML5_Badge_64.png" />
<link rel="apple-touch-icon-precomposed" href="/static/images/identity/HTML5_Badge_64.png" /> <meta content=”yes” name=”apple-mobile-web-app-capable” />该声明是iphone设备中的safari私有meta标签,它表示:允许全屏模式浏览。
WebApp之Meta标签的更多相关文章
- html5 webApp常用Meta标签
		Html5 webApp常用Meta标签 <meta charset="UTF-8"> <meta name="viewport" conte ... 
- WebApp 里Meta标签大全,webappmeta标签大全
		1.先说说mate标签里的viewport: viewport即可视区域,对于桌面浏览器而言,viewport指的就是除去所有工具栏.状态栏.滚动条等等之后用于看网页的区域.对于传统WEB页面来说,9 ... 
- 移动平台webApp的meta标签-----神奇的功效
		对于桌面平台web布局中大家对meta标签再熟悉不过了,它永远位于 head 元素内部,对做SEO的朋友一定对meta有种特殊的感情吧,今天我们就来说说移动平台的meta标签,在移动平台meta标签究 ... 
- WebApp 里Meta标签大全
		1.先说说mate标签里的viewport: viewport即可视区域,对于桌面浏览器而言,viewport指的就是除去所有工具栏.状态栏.滚动条等等之后用于看网页的区域.对于传统WEB页面来说,9 ... 
- 移动平台的WebApp之Meta标签
		对于桌面平台web布局中大家对meta标签再熟悉不过了,它永远位于 head 元素内部,对做SEO的朋友一定对meta有种特殊的感情吧,今天我们就来说说移动平台的meta标签,在移动平台meta标签究 ... 
- WebApp之Meta标签总结
		在做WebApp的时候,少不了Meta标签引用,这里总结了下. <meta name="apple-touch-fullscreen" content="yes&q ... 
- 移动webApp必备技能一、WebApp 里Meta标签大全,webappmeta标签大全
		1.先说说mate标签里的viewport: viewport即可视区域,对于桌面浏览器而言,viewport指的就是除去所有工具栏.状态栏.滚动条等等之后用于看网页的区域.对于传统WEB页面来说,9 ... 
- WebApp之Meta标签  (关闭自动识别数字为电话号码或邮箱之类)
		iPhone上的Safari(还有些webkit android手机浏览器)会自动对看起来像是电话号码的数字串(包括已经加入连字符或括号格式化过的)添加电话链接,点击之后会询问用户是否想要拨打该号码. ... 
- 移动端Web Meta标签
		原文 http://blog.segmentfault.com/jianjian_532633/1190000000654839 添加到推刊 在介绍移动端特有 meta 标签之前,先简单说一下 ... 
随机推荐
- CG&CAD resource
			Computational Geometry The Geometry Center (UIUC) Computational Geometry Pages (UIUC) Geometry in Ac ... 
- @property中strong跟weak的区别
			strong关键字与retain关似,用了它,引用计数自动+1,用实例更能说明一切 @property (nonatomic, strong) NSString *string1; @property ... 
- c文件操作 (转)
			文件文件的基本概念 所谓“文件”是指一组相关数据的有序集合. 这个数据集有一个名称,叫做文件名. 实际上在前面的各章中我们已经多次使用了文件,例如源程序文件.目标文件.可执行文件.库文件 (头文件)等 ... 
- 智能车学习(十二)——智能车原理
			一.直立行走任务分解 1.任务分解 (1) 控制车模平衡:通过控制两个电机正反向运动保持车模直立平衡状态 (2) 控制车模速度:通过调节车模的倾角来实现车模速度控制,实际上最后还是演变成通过控制电机的 ... 
- html  css  js 一些记录.
			webstorm 的基本使用 webstorm 格式化 html 代码: Ctrl+Alt+L js html css 基本使用 注意 dom 的 innerHTML会刷新dom,所以里面包含的事件绑 ... 
- json方式的面向对象
			json方式只适合于一个对象. var p1 = { name:"香菇", sex :"女", dreamdu: { URL: "www.dreamd ... 
- 【maven】 maven的setting.xml文件的详解
			1 Maven的安装 安装Maven之前要确保已经安装好了jdk,并且配置好了环境变量JAVA_HOME.具体安装步骤如下: 从apache网上下载maven项目的压缩包.下载地址为:ht ... 
- 梳理源码中 View 的工作原理
			欢迎Follow我的GitHub, 关注我的掘金. 在View的工作过程中, 执行三大流程完成显示, 测量(measure)流程, 布局(layout)流程, 绘制(draw)流程. 从perform ... 
- vmstat的使用(查看系统各种负载)
			$ vmstatprocs -----------memory---------- ---swap-- -----io---- --system-- -----cpu------ r b swpd f ... 
- BurpSuite的使用总结
			BurpSuite BurpSuite 是一款使用Java编写的,用于Web安全审计与扫描套件.它集成了诸多实用的小工具以完成http请求的转发/修改/扫描等,同时这些小工具之间还可以 互相协作,在B ... 
