Favicon.ico的用法及意义--以及简介通过Favicon.ico来判断网页打开状况

1、定义:

  所谓favicon,即FavoritesIcon的缩写,顾名思义,便是其可以让浏览器的收藏夹中除显示相应的标题外,还以图标的方式区别不同的网站。

当然,这不是Favicon的全部,根据浏览器的不同,Favicon显示也有所区别:在大多数主流浏览器如FireFox和InternetExplorer(5.5及以上版本)中,

favicon不仅在收藏夹中显示,还会同时出现在地址栏上,这时用户可以拖曳favicon到桌面以建立到网站的快捷方式;除此之外,

标签式浏览器甚至还有不少扩展的功能,如FireFox甚至支持动画格式的favicon等。------------网站头像。

2、制作:

  制作Favicon.ico的方法相当简单,常用的Favicon.ico图标有3种16×16、32×32、48×48。首先,利用图形工具创建2个反映网站主题的256色的小图片:

1个为32×32像素,另一个为16 ×16像素。需要注意的是, 调色板要选用“Windows 默认 调色板”,不然,在最终的效果展示中图形可能会发生迥异于您初衷的颜色上变化。

3、网页调用:

  浏览器调用 favicon的原理是首先在网页所在目录寻找favicon.ico文件,如果没有找到就去网站的根目录寻找。所以最简单的方法就是将制作好的favicon文件命名为favicon.ico然后上传到网站的根目录下。

如果您需要将Favicon.ico放到其他目录下,或者希望让不同的网页显示不同的Favicon,就需要在网页Html文件中做设定了,具体设置也很简单,在 Html中的部分加入如下的代码:

      <link rel=”icon” href=”/dir/favicon.ico” mce_href=”/dir/favicon.ico” type=”image/x-icon”>

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

        含义:在浏览器标签中显示favicon,在 收藏夹中显示favicon。

    除此之外,Firefox还支持GIF动画格式的Favicon,使用方法如下:

      首先制作一个16*16的gif动画,然后在html代码中加入如下代码:

      程序代码 :<link rel="shortcut icon" href="favicon.ico" >

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

4、更新:

  如何更新favicon.ico图标,因为本地浏览器存在的缓存可能无法及时更新favicon.ico图标。 关闭所有打开的浏览器,并清空 浏览器缓存

打开网站并加入 收藏夹。 关闭浏览器,重新打开网站,就更新了。 若此时还未更新favicon.ico图标,请稍等一会再打开浏览尝试。

如果是用 360浏览器,无法更新,清除缓存的地址是C:\Documents and Settings\Administrator\Application Data\360se\data\ico,这个位置记录你所浏览的网站的ico,

删除你想更新的ico文件就好了,关掉浏览器,重新打开网站就更新了。如果使用的 火狐或者 chrome浏览器,则更新更加简单,使用 火狐和 chrome的隐私模式进行浏览即可更新缓存 。

时间: 2024-10-13 21:14:33

Favicon.ico的用法及意义--以及简介通过Favicon.ico来判断网页打开状况的相关文章

jQuery的简单用法(jQuery的简介,选择器,属性和css,文档处理)

一.jQuery简介 1.1.  JS库 JavaScript 库封装了很多预定义的对象和实用函数.能帮助使用者建立有高难度交互客户端页面, 并且兼容各大浏览器. 1.2.  当前流行的 JavaScript 库有: ① jQuery ,最流行 ② EXT JS,2.0开始收费 ③ Prototype,对js扩展,框架开发. ④ Dojo ⑤ Bootstrap,来自 Twitter,是目前很受欢迎的前端框架.Bootstrap 是基于 HTML.CSS.JAVASCRIPT 的,它简洁灵活,使

在表格中,th scope=&quot;row&quot;和th scope=&quot;col&quot;中的scope属性的用法及意义

把表头和数据联系起来:scope,id,headers属性就我用到现在,很多表格要比上面提供的例子复杂的多.让例子复杂一点,我会移去"Company"表头,并且把第一列的数据移到表头单元格里: <table summary="The number of employees and the foundation year of some imaginary companies."> <caption>Table 1: Company data&

详解Oracle临时表的几种用法及意义

Oracle临时表可以说是提高数据库处理性能的好方法,在没有必要存储时,只存储在Oracle临时表空间中.希望本文能对大家有所帮助. 1 .前言 目前所有使用 Oracle 作为数据库支撑平台的应用,大部分数据量比较庞大的系统,即表的数据量一般情况下都是在百万级以上的数据量. 当然在 Oracle 中创建分区是一种不错的选择,但是当你发现你的应用有多张表关联的时候,并且这些表大部分都是比较庞大,而你关联的时候发现其中的某一张或者某几张表关联之后得到的结果集非常小并且查询得到这个结果集的速度非常快

Jsoup简介——使用Java抓取网页数据

概述 jsoup 是一款Java 的HTML解析器,可直接解析某个URL地址.HTML文本内容.它提供了一套非常省力的API,可通过DOM,CSS以及类似于jQuery的操作方法来取出和操作数据.jsoup的主要功能如下: 1. 从一个URL,文件或字符串中解析HTML: 2. 使用DOM或CSS选择器来查找.取出数据: 3. 可操作HTML元素.属性.文本: jsoup是基于MIT协议发布的,可放心使用于商业项目. 关于Jsoul的更多介绍,请访问Jsoul的官网:http://jsoup.o

为网站添加favicon.ico图标

前言 貌似每次都是等到网站快收尾时才做favicon.ico的,这次也不例外.这年代-- 步骤 1.PS制作正方形图标,格式为jpg.jpeg.gif或png. 2.将图标转换为ICO格式,网上有很多在线转换工具,如http://www.ico.la/old.html . 3.将转换好的ICO格式图标放到网站中. 4.网页代码<head></head>之间添加: <link rel="shortcut icon" href="images/fav

chrome浏览器更换favicon.ico后不更新缓存解决方案

chrome浏览器更换favicon.ico后不更新缓存 1.按ctrl+F5强制刷新或网页上右键重新载入.2.再不行就删除缓存.3.但这样太讨厌了,还有个小窍门屡试不爽,那就是直接在浏览器地址栏访问favicon文件.4.如果访问还是原先的ico文件,在浏览图片时刷新一下,再回到网站看一下,已经解决了,毕竟谁都不愿意为这个问题去清缓存和cookies什么的.

Tomcat修改favicon.ico图标,Linux下Tomcat修改favicon.ico图标,Tomcat更换favicon.ico图标

Tomcat修改favicon.ico图标,Linux下Tomcat修改favicon.ico图标,Tomcat更换favicon.ico图标 >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> ?Copyright 蕃薯耀 2017年3月2日 http://www.cnblogs.com/fanshu

[转]网站地址栏小图标favicon.ico的制作方法

有人也许会好奇,有的网址前面有个漂亮的小图标而且有的网站图标还会动,这是怎么做到的呢? 如下图所示: 那个小图标有个名字叫favicon.ico,网站图标虽小但可以起到很好的点缀作用,尤其是当浏览者将你的网站放入收藏夹之后,网站图标的作用就出来了,它可以使你的站点在众多网址中突出显示,对于用户体验起到很好的作用,好了,废话不多说,现在来告诉大家怎么做favicon.ico这个网站图标文件. 虽然现在有很多在线制作网站图标的网站,但制作出来的图标实在是差强人意,而且不支持透明样式的ico,这非常糟

Django中favicon.ico文件的配置

默认情况下,浏览器访问一个网站的时候,同时还会向服务器请求“/favicon.ico”这个URL,目的是获取网站的图标. 若没有配置的话,Django就会返回一个404错误,并且浏览器接收到这个404错误后不会显示出来,一般不会被察觉. 但是服务器要是开启日志记录的话,这错误就会一直记录下来,累积一大堆无用的记录. 步骤如下: 制作一个ico文件,使用PS或者某些在线生成ico的网站即可 将此文件命名为“favicon.ico”后放在static/下 在url.py中添加: from Djang