apple-touch-startup-image 在 ios 15.4+ 中重新支持，需用 配合精确 media 查询声明多尺寸 png 启动图，图片须无透明通道、正确命名放置，且 web app 必须通过“添加到主屏幕”以 standalone 模式运行。
要在 iOS 设备上为 Web App 设置启动时显示的 Apple Splash 屏幕（即“添加到主屏幕”后全屏打开时的首屏画面），不能用 <link> 标签直接关联普通图片，而是必须按 Apple 官方规范提供特定尺寸、命名和放置方式的 PNG 图片，并通过 <link rel="apple-touch-startup-image"> 正确声明。
使用正确的 link 标签语法
在网页 中添加如下标签（注意：iOS 15.4+ 才支持 rel="apple-touch-startup-image" 的现代写法）：
- 针对较新 iOS（15.4+）：用
rel="apple-touch-startup-image"，并配合media属性指定设备尺寸与方向 - 每个
<link>对应一个精确尺寸的 PNG 文件，不可缩放或裁剪 - 图片必须是纯 PNG 格式（无透明通道更稳妥），放在可公开访问的路径下
提供多尺寸适配的图片文件
iOS 启动图需严格匹配设备分辨率与状态栏位置。常见尺寸包括：
- iPhone SE / 8 / X / XR 竖屏：
750×1334 - iPhone 12/13/14 竖屏：
1170×2532 - iPhone 12 Pro Max / 14 Plus 竖屏：
1284×2778 - iPad Pro 12.9"（第5代+）横屏：
2048×2732
建议将所有图片统一放在 /images/splash/ 目录下，例如：splash-1170x2532.png。
在 head 中声明多个 link 标签
每个尺寸对应一条 <link>，示例：
<link rel="apple-touch-startup-image" href="/images/splash/splash-750x1334.png" media="(device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)"><link rel="apple-touch-startup-image" href="/images/splash/splash-1170x2532.png" media="(device-width: 390px) and (device-height: 844px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)"><link rel="apple-touch-startup-image" href="/images/splash/splash-1284x2778.png" media="(device-width: 428px) and (device-height: 926px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)"><link rel="apple-touch-startup-image" href="/images/splash/splash-2048x2732.png" media="(device-width: 1024px) and (device-height: 1366px) and (-webkit-device-pixel-ratio: 2) and (orientation: landscape)">
务必确保 media 查询与目标设备完全一致，否则 iOS 会忽略该条目。
验证与注意事项
不生效的常见原因：
- 图片返回 HTTP 404 或 MIME 类型不是
image/png - 服务器未启用缓存头，导致 iOS 拒绝加载（建议设置
Cache-Control: public, max-age=31536000） - Web App 未通过 Safari “分享 → 添加到主屏幕” 安装（仅当以 PWA 方式运行才触发 Splash）
- 未在
manifest.json中配置"display": "standalone"（虽非强制，但推荐）
测试时请使用真机 + 最新版 iOS，模拟器不支持此特性。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
