在Firefox浏览器下显示动态icon图标

2016-12-27 10:35 出处:未知 人气: 评论(0

我们都知道我们可以写一段html来把浏览器的地址栏图标替换成自己网站的图标,但是你知道在不同你浏览器下显示不同icon图标的方法吗?尤其是在Firefox下还能显示动态的地址栏icon图标呢!下面icech就为大家讲解一下如何设置不同浏览器下不同的地址栏icon图标。

1、普通方式下的地址栏icon图标替换

方法1:制作一个ico图标,然后重命名为favicon.ico,将这个icon图标文件上传至网站的根目录下就可以了。

说明:这种方法适用于各种浏览器的地址栏icon图标和收藏夹图标。

方法2:在网页的head中加入以下代码:

IE或者Firefox地址栏前换成自己的图标
< link rel="icon" href="favicon.ico" type="image/x-icon">
< link rel="Shortcut Icon" href="favicon.ico" type="image/x-icon">

可以在收藏夹中显示出你的图标
< link rel="Bookmark" href="favicon.ico" type="image/x-icon">

说明:这种方式适用于IE浏览器。

2、在Firefox下显示动态的icon图标

首先制作出一个大小为16×16像素的gif图片,文件名没有要求。然后上传到icon目录下(任意目录都可以),然后在head中加入代码:

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

这样在Firefox浏览器下就能在地址栏中显示动态的icon图标了!但是这种方式不能再IE中显示动态效果。

所以同时使用两个代码,就可以同时在IE和Firefox浏览器的地址栏下显示不同的icon图标了。在不同浏览器下地址栏ico图标显示效果可以点击这里查看到。

代码如下:
< link rel="icon" href="favicon.ico" type="image/x-icon">
< link rel="Shortcut Icon" href="favicon.ico" type="image/x-icon">
< link rel="icon" href="icon/animated_favicon.gif" type="image/gif">

注意:不论是icon格式还是gif格式的图标,大小都应该是16×16像素。代码“< link”中icech加了一个空格,使用的时候要注意去掉空格。
分享给小伙伴们:

相关文章

评论

发表评论愿您的每句评论,都能给大家的生活添色彩,带来共鸣,带来思索,带来快乐。

签名: 验证码: 点击我更换图片

评论列表

    • Ico5网可以将png转ico和所有图片转ico, 透明ico图标制作、动态ico图标制作方法及ico图标下载!
    • 热门关键词:ico制作 在线favicon.ico生成 ico图标制作

    Copyright © 2015-2016 Ico5.cc.版权所有 ico图标制作网 皖ICP备16019369号-2