HTML Favicon和Apple图标

Posted 2021-05-24

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了HTML Favicon和Apple图标相关的知识，希望对你有一定的参考价值。

&lt;!-- Place favicon.ico and apple-touch-icon.png in the root of your domain and delete these references --&gt;
&lt;link rel=&quot;shortcut icon&quot; href=&quot;/favicon.ico&quot;&gt;
&lt;link rel=&quot;apple-touch-icon&quot; href=&quot;/touch-icon-iphone.png&quot;&gt;
&lt;link rel=&quot;apple-touch-icon&quot; sizes=&quot;72x72&quot; href=&quot;touch-icon-ipad.png&quot; /&gt;
&lt;link rel=&quot;apple-touch-icon&quot; sizes=&quot;114x114&quot; href=&quot;touch-icon-iphone4.png&quot; /&gt;
&lt;link rel=&quot;apple-touch-icon-precomposed&quot; href=&quot;/touch-icon-android.png&quot;/&gt;

Favicon和苹果图标

A favicon (short for favorites icon), also known as a shortcut icon, website icon, URL icon, or bookmark icon is a 16Ã—16 or 32Ã—32 pixel square icon associated with a particular website or webpage. The interesting bit here is the apple-touch-icon which is used if you save a bookmark to your home screen on an apple touch device such as an iPad or iPhone. Interestingly enough, android also supports its usage. The apple-touch-icon default size is 57px by 57px. As the comment says, if your icons are in the root of your domain, these links arenâ€™t required.

<!-- Place favicon.ico and apple-touch-icon.png in the root of your domain and delete these references -->
<link rel="shortcut icon" href="/favicon.ico">
<link rel="apple-touch-icon" href="/touch-icon-iphone.png">
<link rel="apple-touch-icon" sizes="72x72" href="touch-icon-ipad.png" />
<link rel="apple-touch-icon" sizes="114x114" href="touch-icon-iphone4.png" />
<link rel="apple-touch-icon-precomposed" href="/touch-icon-android.png"/>

以上是关于HTML Favicon和Apple图标的主要内容，如果未能解决你的问题，请参考以下文章

HTML Favicon和Apple图标

HTML中的Favicon和Apple图标

Favicon和Apple Touch图标

iOS 书签显示 favicon 而不是 apple-touch-icon

Favicon和苹果图标

apple-touch-icon,shortcut icon和icon的区别(手机站发送到手机桌面图标自定义)