January 16, 2021
By: Kevin

iphone/ipad上safari保存网页到Home Screen

要求: 通过safari打开的网页, 可以通过发送到'保存至首页' 后

  1. 能够全屏幕(隐藏地址栏)
  2. 在首页有自己的独立icon
  3. splash screen
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0,minimum-scale=1.0">
<!-- iPad and iPad mini (with @2× display) iOS ≥ 8 -->
  <link rel="apple-touch-icon-precomposed" sizes="180x180" href="img/touch/icon-1024.png">
  <link rel="shortcut icon" href="img/touch/icon-1024.png">
  <!-- IOS 主屏幕应用全屏 -->
  <meta name="apple-mobile-web-app-capable" content="yes">
  <!-- 安卓 主屏幕应用全屏 -->
  <meta name="mobile-web-app-capable" content="yes">　
  <!-- IOS默認的時間、電池、供應商等信息 -->		　　
  <meta name="apple-mobile-web-app-status-bar-style" content="black" />
  <meta name="apple-mobile-web-app-capable" content="yes">
  <title>如意3D定制系统</title>
  <link rel="stylesheet" href="index.css" />
</head>
<body>
  <div id="root"></div>
  <script src="index.js"></script>
</body>
</html>

再配置上相应的icon就可以了.

Tags: ios