自定义网站在Safari中添加至主屏幕的图标

默认添加网站到主屏幕,显示的图标为网站的截图


使用下面的标签可以自定义图标
<link rel="apple-touch-icon-precomposed" href="icon.png">

该标签还支持size属性,可以指定不同尺寸
<link rel="apple-touch-icon-precomposed" sizes="57x57" href="icon-57.png">
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="icon-72.png">
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="icon-114.png">
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="icon-144.png">

另外apple-touch-icon也可以达到效果。区别看单词意思,一个有IOS默认图标高亮一个无。


参考:
https://developer.apple.com/library/ios/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html#//apple_ref/doc/uid/TP40002051-CH3-SW4

你可能感兴趣的:(自定义网站在Safari中添加至主屏幕的图标)