<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标签的更多相关文章

  1. html5 webApp常用Meta标签

    Html5 webApp常用Meta标签 <meta charset="UTF-8"> <meta name="viewport" conte ...

  2. WebApp 里Meta标签大全,webappmeta标签大全

    1.先说说mate标签里的viewport: viewport即可视区域,对于桌面浏览器而言,viewport指的就是除去所有工具栏.状态栏.滚动条等等之后用于看网页的区域.对于传统WEB页面来说,9 ...

  3. 移动平台webApp的meta标签-----神奇的功效

    对于桌面平台web布局中大家对meta标签再熟悉不过了,它永远位于 head 元素内部,对做SEO的朋友一定对meta有种特殊的感情吧,今天我们就来说说移动平台的meta标签,在移动平台meta标签究 ...

  4. WebApp 里Meta标签大全

    1.先说说mate标签里的viewport: viewport即可视区域,对于桌面浏览器而言,viewport指的就是除去所有工具栏.状态栏.滚动条等等之后用于看网页的区域.对于传统WEB页面来说,9 ...

  5. 移动平台的WebApp之Meta标签

    对于桌面平台web布局中大家对meta标签再熟悉不过了,它永远位于 head 元素内部,对做SEO的朋友一定对meta有种特殊的感情吧,今天我们就来说说移动平台的meta标签,在移动平台meta标签究 ...

  6. WebApp之Meta标签总结

    在做WebApp的时候,少不了Meta标签引用,这里总结了下. <meta name="apple-touch-fullscreen" content="yes&q ...

  7. 移动webApp必备技能一、WebApp 里Meta标签大全,webappmeta标签大全

    1.先说说mate标签里的viewport: viewport即可视区域,对于桌面浏览器而言,viewport指的就是除去所有工具栏.状态栏.滚动条等等之后用于看网页的区域.对于传统WEB页面来说,9 ...

  8. WebApp之Meta标签 (关闭自动识别数字为电话号码或邮箱之类)

    iPhone上的Safari(还有些webkit android手机浏览器)会自动对看起来像是电话号码的数字串(包括已经加入连字符或括号格式化过的)添加电话链接,点击之后会询问用户是否想要拨打该号码. ...

  9. 移动端Web Meta标签

    原文  http://blog.segmentfault.com/jianjian_532633/1190000000654839 添加到推刊   在介绍移动端特有 meta 标签之前,先简单说一下 ...

随机推荐

  1. 用.NET开发通用Windows App

    (此文章同时发表在本人微信公众号"dotNET每日精华文章",欢迎右边二维码来关注.) 题记:随着Windows 10的正式发布,作为.NET开发人员应该开始或多或少了解一下通用( ...

  2. C++读取txt文件

    1. 逐行读入 void readTxt(string file) { ifstream infile; infile.open(file.data()); //将文件流对象与文件连接起来 asser ...

  3. C# 使用 NPOI 库读写 Excel 文件

    NPOI 是开源的 POI 项目的.NET版,可以用来读写Excel,Word,PPT文件.在处理Excel文件上,NPOI 可以同时兼容 xls 和 xlsx.官网提供了一份 Examples,给出 ...

  4. NDK-gdb

    http://www.gnu.org/software/gdb/download/ http://mhandroid.wordpress.com/2011/01/23/using-eclipse-fo ...

  5. 【工具】Git

    1.安装好Git以后,在开始菜单里找到Git->Git Bash,弹出一个命令窗口 2.设置邮箱 . 3.创建文件夹 4.创建版本库 5.将文件添加到缓存区中去 6.提交文件 7.检查是否还有文 ...

  6. JavaScript BOM对象介绍

    bom:即broswer object model(浏览器对象模型),由五个对象组成:        Window:对象表示浏览器中打开的窗口 最顶层对象.       Navigator :浏览器对 ...

  7. 记一次小团队Git实践(下)

    在上篇中,我们已经能基本使用git了,接下来继续更深入的挖掘一下git. 更多的配置自定义信息 除了前面讲的用户名和邮箱的配置,还可以自定义其他配置: # 自定义你喜欢的编辑器,可选 git conf ...

  8. hdu1712 分组背包

    题目链接:http://acm.split.hdu.edu.cn/showproblem.php?pid=1712 题意:有n门课程,和m天时间,完成mp[i][j]得到的价值为第i行j列的数字,求最 ...

  9. Python与Hack之守护进程

    1.什么是守护进程: 在linux或者unix操作系统中,守护进程(Daemon)是一种运行在后台的特殊进程,它独立于控制终端并且周期性的执行某种任务或等待处理某些发生的事件.由于在linux中,每个 ...

  10. Wireshark工具创建过滤器的方式

    Wireshark工具创建过滤器的方式  [实例1-3]现在要抓取目的或来源地址为192.168.5.9的封包.在图1.5中添加如下所示的条件: tcp dst port 3128 添加后单击Star ...