首页 > 互联网技术 > 浏览器地址栏中加入ico图标的二种方法

浏览器地址栏中加入ico图标的二种方法

浏览器自动识别的方式

直接在网站根目录中放入名为 favicon.ico的文件即可,关闭页面,重新访问站点,即可看到浏览器地址栏中多了刚放入的图标,基本原理是:浏览器会自动在网站根目录下加载名称为favicon.ico文件,将其加到浏览器地址栏中。

代码加入的方式

在你的网页文件之间加入下面代码:
1、在URL地址栏中显示ico
2、在收藏夹中显示ico

<link href="http://www.itblood.com/favicon.ico" 
	type="image/x-icon" rel="shortcut icon"/>
<link rel="Bookmark" href="http://www.itblood.com/favicon.ico">

如果是wordpress搭建的站点,可以采用下面相对路径加入

<link href="<?php bloginfo('template_url'); ?>/image/favicon.ico" 
	type="image/x-icon" rel="shortcut icon"/>
<link rel="Bookmark" href="<?php bloginfo('template_url'); ?>/image/favicon.ico">

注意,文件一定要是ico格式,要达到这个效果,图像最好是16*16像素,不要超过16色。文件格式为ico,然后上传至你的网站。

各浏览器出现的问题解决

网站地址栏ICO图标在搜狗浏览器显示不出来,在其他的我都测试过可以显示,如果遇到这样的问题,具体的解决办法如下:
请关闭搜狗浏览器。
第一步,请打开“开始”菜单,找到“运行”
第二步,在“运行”里面输入%appdata%/SogouExplorer/FavIcon,回车 (包括百分号)
第三步,找到目录,双击进入
第四步,把FavIcon目录下的内容全部删除试试

加入之后的具体效果可以查看本网站

除非注明,文章为IT热血青年原创,欢迎转载!转载请注明本文地址,谢谢。
本文地址:http://blog.itblood.com/browser-address-bar-to-join-ico-icon.html

  1. 本文目前尚无任何评论.
  1. 本文目前尚无任何 trackbacks 和 pingbacks.