Apple 触摸图标指南
当有人将您的网站添加到 iOS 主屏幕时，Safari 使用 apple-touch-icon — 而不是 favicon.ico。提供一个 180×180 PNG（或可以干净地缩小比例的更大的正方形）并将其链接到您的 <head> 中。
Apple 不会像对本机应用程序那样在现代 iOS 上对网页剪辑应用遮罩，但您的图标仍应为方形并具有安全边距 - 保持徽标插入约 10%，以便圆角永远不会剪辑艺术品。
使用<link rel =“apple-touch-icon”sizes =“180x180”href =“/apple-touch-icon.png”>。单个 180×180 文件涵盖当前所有 iPhone；可选的 152×152 和 167×167 条目有助于旧版 iPad 布局。
工作原理
- 1
出口180×180 PNG
来自我们的网站图标生成器或图像调整器。
- 2
上传到站点根目录
/apple-touch-icon.png 与 favicon.ico 并列。
- 3
添加链接标签
<link rel="apple-touch-icon" Sizes="180x180" href="/apple-touch-icon.png"> 在 <head> 中。
立即尝试
生成apple-touch-icon
Favicon 生成器常见问题
apple-touch-icon 尺寸是多少？+
目前的 iPhone 为 180×180 像素。从 512×512 或 1024×1024 母版导出。
PNG 或 ICO 代表 iOS？+
仅限 PNG。 iOS 忽略主屏幕图标的 .ico。
我还需要 favicon.ico 吗？+
是的 - 选项卡和其他浏览器仍然使用 .ico。 Apple-触摸图标是附加的。