[Phonegap+Sencha Touch] 移动开发11 移动平台的link标签和meta标签——神奇的功效

看sencha touch创建的项目的resources目录底下有三个文件夹，icons、loading、startup，里面有些图片
但是实际打包安装包出来并没有用到这些图片。

偶然发现发布出来的网页版webapp，用google开发工具查看页面元素，发现在head里面有下面这样几个标签:



在ios中，当把网站通过safari添加到主屏幕功能放置到移动设备桌面上("添加至主屏幕")以后
1、通过设置apple-touch-startup-image可以为添加至主屏幕的webapp设置一个类似NativeApp的启动画面。
上图的这个配置刚好用到的就是resources/startup目录下的图片。

2、而apple-touch-icon-precomposed就是指定添加至主屏幕的webapp的图标了。

3、还有个指定图标的属性apple-touch-icon，和apple-touch-icon-precomposed的区别就是
apple-touch-icon是"增加一层透明高光层的图标"
apple-touch-icon-precomposed是"原图图标"

上图还有三个meta标签：
1、apple-mobile-web-app-capable
删除默认的苹果工具栏和菜单栏。
content有两个值”yes”和”no”,当我们需要显示工具栏和菜单栏时，这个行meta就不用加了，默认就是显示。

2、apple-touch-fullscreen
全屏显示

3、apple-mobile-web-app-status-bar-style
控制状态栏显示样式
content有三个值"default", "black"和"black-translucent"





欢迎加入Sencha Touch + Phonegap 群：194182999
共同学习交流（博主QQ：479858761）