Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/ios/94.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Html 正确的iOS网络剪辑集成(网络应用图标)_Html_Ios_Ios6_Ios7 - Fatal编程技术网

Html 正确的iOS网络剪辑集成(网络应用图标)

Html 正确的iOS网络剪辑集成(网络应用图标),html,ios,ios6,ios7,Html,Ios,Ios6,Ios7,我已决定将我的web应用程序图标更改为iOS 这是我用来链接图标的方式: <!-- iOS 7 iPad (retina) --> <link href="/assets/img/misc/ios/apple-touch-icon-152x152-precomposed.png" sizes="152x152" rel="apple-touch-icon-precomposed"> <!-- iOS 6 iP

我已决定将我的web应用程序图标更改为iOS

这是我用来链接图标的方式:

<!-- iOS 7 iPad (retina) -->
<link href="/assets/img/misc/ios/apple-touch-icon-152x152-precomposed.png"
              sizes="152x152"
              rel="apple-touch-icon-precomposed">

<!-- iOS 6 iPad (retina) -->
<link href="/assets/img/misc/ios/apple-touch-icon-144x144-precomposed.png"
              sizes="144x144"
              rel="apple-touch-icon-precomposed">

<!-- iOS 7 iPhone (retina) -->
<link href="/assets/img/misc/ios/apple-touch-icon-120x120-precomposed.png"
              sizes="120x120"
              rel="apple-touch-icon-precomposed">

<!-- iOS 6 iPhone (retina) -->
<link href="/assets/img/misc/ios/apple-touch-icon-114x114-precomposed.png"
              sizes="114x114"
              rel="apple-touch-icon-precomposed">

<!-- iOS 7 iPad -->
<link href="/assets/img/misc/ios/apple-touch-icon-76x76-precomposed.png"
              sizes="76x76"
              rel="apple-touch-icon-precomposed">

<!-- iOS 6 iPad -->
<link href="/assets/img/misc/ios/apple-touch-icon-72x72-precomposed.png"
              sizes="72x72"
              rel="apple-touch-icon-precomposed">

<!-- iOS 6 iPhone -->
<link href="/assets/img/misc/ios/apple-touch-icon-57x57"
              sizes="57x57"
              rel="apple-touch-icon-precomposed">

这就是我发现的新方法:

<link rel="apple-touch-icon" href="/assets/img/misc/ios/icon.png" />
<link rel="apple-touch-icon" sizes="72x72" href="/assets/img/misc/ios/icon-72.png" />
<link rel="apple-touch-icon" sizes="114x114" href="/assets/img/misc/ios/icon@2x.png" />
<link rel="apple-touch-icon" sizes="144x144" href="/assets/img/misc/ios/icon-72@2x.png" />

但是,当我在iOS上测试新方法时,它不起作用,因此我想知道什么是使IOS6和IOS7显示web应用程序图标的绝对正确方法?

例如,要为不同的设备分辨率指定多个图标,请同时支持iPhone和iPad设备为每个链接元素添加一个Size属性,如下所示:


将使用最适合设备大小的图标。如果未设置“大小”属性,则元素的大小默认为60 x 60

所以从技术上来说,你的新方法应该很好。注意:文档中列出了iOS 7的尺寸。如果您有所有正确的尺寸,它们将被专门使用

如果您没有所有正确的尺寸

使用大于建议大小的最小图标。如果没有大于建议大小的图标,则使用最大的图标

这意味着您可以只包括iOS 7尺寸。我看不出有任何理由在添加或删除旧图标方面付出额外的努力。但如果质量需要,请为所有版本的iOS提供正确的尺寸

如果没有使用html中的链接元素指定图标

在网站根目录中搜索带有apple touch图标的图标。。。前缀例如,如果设备的适当图标大小为60 x 60,系统将按以下顺序搜索文件名:

apple-touch-icon-76x76.png

apple-touch-icon.png

因此,只要正确命名文件并将其放在根目录中,实际上也不必使用link元素

这里有一个苹果公司关于

<link rel="apple-touch-icon" href="touch-icon-iphone.png">
<link rel="apple-touch-icon" sizes="76x76" href="touch-icon-ipad.png">
<link rel="apple-touch-icon" sizes="120x120" href="touch-icon-iphone-retina.png">
<link rel="apple-touch-icon" sizes="152x152" href="touch-icon-ipad-retina.png">