自定义网站的icon和收藏夹图标

定制网站收藏夹图标的方法有两种：

第一种方法：
　　第一步，当然是准备一个能体现您的主页的风格和个性的图标。比较简便的办法除了下载，就是将您的网站的logo做成一个图标。
　　第二步，将这个图标文件命名为：favicon.ico。
　　第三步，将favicon.ico上传到您的网站所在的服务器的根目录下。您不需要对您的网页文件作任何的修改，Internet Explorer 5会自动的不停的搜索您的网站的根目录，它一旦发现了favicon..ico这个文件，就会将该图标显示在访问者的地址栏和收藏夹列表中了。
　　使用这种方法来定制收藏夹图标，有一个明显的缺陷，就是收藏夹图标只能在网站的首页中显示。

第二种方法：
　　第一步，还是准备一个能体现您的主页的风格和个性的图标。
　　第二步，将这个图标文件命名为任意的文件名，如myicon.ico。
　　第三步，在网页文件的head部分加入下面的内容：　　

<link rel="shortcut icon" href="http://www.mysite.com/myicon.ico" type="image/x-icon">。

　　注意：图标文件的路径一定要使用绝对路径。
　　这种方法就可以使所有的页面都能显示收藏夹图标了。
　　最后还有一点需要说明的是，有些Web站点的主机服务器（如：Geocities）不支持图标文件格式（.ico），这时您就需要与系统管理员联系，要求他开通对图标文件格式的支持，当然也可以使用type属性来定义图片的类型，如：type="image/x-icon" "image/png" "image/gif"

通过link rel="icon"可以实现部分浏览器的动画图标效果

语句一:<link rel="shortcut icon" href="favicon.ico" />
语句二<link rel="icon" href="animated_favicon.gif" type="image/gif" />

Favicon功能最早由微软创设，而微软公司的Internet Explorer网页浏览器会对每一个网站都请求favicon。微软支持的link标签不遵从World Wide Web Consortium（W3C，万维网联盟）的HTML建议[1]，因为：

rel属性必须包含一个用空格作分隔符的link类型的列表，所以一个包含两词的link类型不能被遵守标准的浏览器理解。
“.ico”文件类型（一种用于Microsoft Windows上图标的光栅格式）没有一个注册的MIME类型，而且似乎在当时也不能被多数浏览器理解。然而2003年，这一格式在IANA获得注册，其MIME类型是image/vnd.microsoft.icon，进而消除了此问题的第一部分。
在网站上使用保留地址（reserved location）与Architecture of the World Wide Web（互联网的结构）矛盾，同时被认为是link squatting（链接劫持）或URI squatting（URI劫持）。

Mozilla浏览器通过一种遵从Web标准的方法添加了对favicon的支持。它采用rel="icon"并允许网络设计人员添加任何支持的图像格式的favicon。例如

<link rel="icon" type="image/png" href="/path/image.png">。

后来鉴于此功能将被用于所有新内容，多数浏览器都对此功能增加了支持。

利用图标工具（有很多）制作图标文件（favicon.ico）上传到网站所在的服务器的根目录下，这个文件必须是16*16大小的图标文件。当然，也可以在<head></head>之间加上

<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />

就可以了。但是，ico给出的是静态的图标文件。

如果想要动起来，就得做个gif动画了。gif动画也是16*16的，传到服务器。在<head></head>之间加上：

<link rel="icon" href="animated_favicon.gif" type="image/gif" >

就可以了。

如果想要收藏夹中的图标也要改变的话，那么就加上这句：

<link rel="Bookmark" href="favicon.ico" />

这个图标还可以使用png格式，png格式现在的势头很猛。

自定义网站的icon和收藏夹图标相关推荐

网站icon收藏夹图标
<link rel="icon" href="/jb51.ico" type="image/x-icon"/> <link ...
#网站图标、地址栏图标、收藏夹图标、favicon.ico
本文关键词:网站图标.地址栏图标.收藏夹图标相关链接: 百度百科:favicon.ico 关于shortcut icon和icon代码的区别介绍一.favicon.ico的显示的位置: 1.在地址 ...
一个很小的图标需要另一个HTTP请求是不是很愚蠢？如何将收藏夹图标放到精灵中？
本文翻译自:Isn't it silly that a tiny favicon requires yet another HTTP request? How can I put the favico ...
如何在iPhone，iPad或Mac上的Safari中启用收藏夹图标
Safari 12 is here with a feature we've all been waiting for: favicons. Here's how to enable them on ...
Ubuntu18.04 同一个程序显示两个图标，收藏夹图标不合并问题解决
一.同一个程序运行时的窗口图标与收藏夹图标不合并的问题: 在网上看到了很多都在复制粘贴别人的内容,都是让添加StartupWMClass,有时候这样并不会生效,另外收藏夹的图标添加有两种情况: 1)从 ...
Chrome 浏览器创建网站快捷方式（加入收藏夹）代码
大家都知道,Chrome 浏览器是不支持 JS 代码将网站加入收藏夹|加入书签的,但是这个代码可以将网站以快捷方式(加入收藏夹|加入书签)的方式将网站放在用户桌面上,这样也方便用户日后访问网站,此方法 ...
删除“ie8左侧收藏夹图标（黄星星）”及“恢复”的方法
将下列代码存入.reg文件: Windows Registry Editor Version 5.00 [HKEY_LOCAL_MACHINE\SOFTWARE\Policies\Microsoft\ ...
关于地址栏收藏夹的图标
为什么我把图表放到根目录后无论刷新多少次主页,图表都没有在地址栏中显示出来注:此时我还没有把主页加入收藏夹当我把主页加入收藏夹后,一刷新图标就出来了为什么?God tell me 还有maxt ...
如何给网站设置自定义图标（标签页显示，收藏夹显示）
在 PC 浏览器上显示网站图标方法1: 在网站根目录下准备一张名为 favicon 的图片,图片格式为 ico . 图片像素的最小尺寸为:16*16 使用这种方式,网页会自动选取这张图片作为图标,并 ...

自定义网站的icon和收藏夹图标

自定义网站的icon和收藏夹图标相关推荐

最新文章

热门文章