IOS添加到主屏幕应用

Hybrid App

native app--原生app
web app--就是web应用,只能在浏览器进行查看,html,css,js
hybrid app--混合应用,指web端和native混合形成的app,这其实我们用Safari浏览器添加到主屏幕的应用app

Hybrid app可以理解为运行在安卓和ios上的终端应用,可以跨平台,渲染快,不会崩溃,没有app审核,快速减少开发周期等

<meta name="apple-mobile-web-app-title" content="你的标题">  //定义了添加到主屏幕的快捷启动页名字
<meta name="apple-mobile-web-app-capable" content="yes">    //应用全屏展示
<meta name="apple-mobile-web-app-status-bar-style" content="black">  //apple-mobile-web-app-capable的前提下，设置状态栏的属性值apple-mobile-web-app-status-bar-style才有效  
<meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no"/>  //viewport，width用于指定宽度，initial-scale指定初始化的缩略比例，minimum-scale指定缩小的比例，而maximum-scale则是放大的比例，当然这些缩放都取决于user-scalable——决定用户是否能缩放页面
<link rel="apple-touch-icon" href="/static/xxx.icon">  //定义了你添加到主屏幕的icon
<link rel="apple-touch-icon-precomposed" href='/static/xxx.icon"> //和上面一样,区别就是有一层高光
<link rel="apple-touch-icon" href='/static/xxx.icon" sizes="57x57"> //sizes还可以图标增加尺寸,当然要适配ipad,所以所有有四种,72x72,114x114,144x144

参考

https://www.jianshu.com/p/bb6606983424

版权声明：本文原创发表于 博客园，作者为 RainBol 本文欢迎转载，但未经作者同意必须保留此段声明，且在文章页面明显位置给出原文连接，否则视为侵权。