favicon.ico显示,favicon显示,favicon图标显示

>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>.

蕃薯耀 2016年7月19日 17:39:33 星期二

http://fanshuyao.iteye.com/

一、favicon图标显示

1、把favicon.ico图标文件放在项目的根目录下,命名必须是:favicon.ico 。

2、在<head></head>标签中加入下面的代码:

<link rel="shortcut icon" type="image/ico" href="${pageContext.request.contextPath}/favicon.ico"/>
<link rel="bookmark" href="${pageContext.request.contextPath}/favicon.ico"/>

(1)rel="shortcut icon" 表示标签页显示的图标,对应的href表示图标的路径,可以是相对路径或者绝对路径。例子中是Java项目,使用了绝对路径。

相对路径可以如下:

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

(2)rel="bookmark" 表示收藏夹显示图标,效果如下:

没有使用bookmark,在收藏后没有图标,或者显示Tomcat的图标,使用后更加漂亮。

二、favicon图标制作

1、找一张背景透明的图片,支持格式 png、jpg、gif ,但必须是背景透明的,这样制作出来的favicon.ico图标美观。

2、打开http://www.atool.org/ico.php,选择图片,然后选择 32 * 32 的格式(因为这样兼容较多的浏览器,并不是越大越好),然后点击【在线生成favicon.ico图标】,即可生成。

3、打开生成的图片,生成的图片虽然背景颜色显示是白色的,但放入到服务器项目根目录中显示出来是没有白色背景的,完美显示。

注意:有些网站制作的favicon.ico是真的有白色背景的,这样不美观,建设还是到http://www.atool.org/ico.php制作,毕竟本人亲自尝试过,这样能避免不必要的麻烦。

>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>.

蕃薯耀 2016年7月19日 17:39:33 星期二

http://fanshuyao.iteye.com/

favicon.ico显示,favicon显示,favicon图标显示的更多相关文章

  1. 如何给网页标题栏上添加图标(favicon.ico)

    favicon.ico详解:     favicon是Favorites Icon的缩写,favicon.ico是指显示在浏览器收藏夹.地址栏和标签标题前面的个性化图标. 设置步骤: 1. 把做好的f ...

  2. 网页favicon.ico图标设置(转)

    随便打开一个网页:比如 http://www.baidu.com/ 可以看到在浏览器的标签头上面显示了一个图标,这个图标是:,也就是我们常说的favicon.ico. 由于这篇文章主要讨论favico ...

  3. favicon.ico 网站小图标标识

    随便打开一个网页:比如 http://www.baidu.com/ 可以看到在浏览器的标签头上面显示了一个图标,这个图标是:,也就是我们常说的favicon.ico. 由于这篇文章主要讨论favico ...

  4. 如何给网页标题栏上添加图标(favicon.ico)(转)

    如何给网页标题栏上添加图标(favicon.ico)   favicon.ico详解:     favicon是Favorites Icon的缩写,favicon.ico是指显示在浏览器收藏夹.地址栏 ...

  5. 如何让网页在浏览器标题栏显示自己制作的图标ico

    第一步,制作一个尺寸16x16大小的PNG图片,可以用photoshop等图片处理工具来设计,然后保存到本地电脑上,通过ico在线制作或使用IconWorkshop工具制作ICO图标,ico图标命名为 ...

  6. ASP.NET网站如何显示自己的网页图标

    转载自 http://www.webtag123.com/dotnet/17238.html 1. 直接放个ico图标到你网站的根目录,并命名为favicon.ico就可以了.favicon.ico应 ...

  7. nginx access.log 忽略favicon.ico訪问记录的方法

    favicon.ico 文件是浏览器收藏网址时显示的图标,当第一次訪问页面时.浏览器会自己主动发起请求获取页面的favicon.ico文件.当/favicon.ico文件不存在时,服务器会记录404日 ...

  8. favicon.ico请求处理

    favicon.ico 图标用于收藏夹图标和浏览器标签上的显示,如果不设置,浏览器会请求网站根目录的这个图标,如果网站根目录也没有这图标会产生 404. 出于优化的考虑,要么就有这个图标,要么就禁止产 ...

  9. firefox和chrome对于favicon.ico关于content-security-policy的不同处理

    1.favicon.ico是网站的title图标 2.在设置CSP时,举例如下,表示只允许来源为https://my.alipay.com的图片,如果不是,则向指定的url(report.php)发出 ...

  10. 移动端页头推荐配置 出现找不到favicon.ico错误原因和解决方法

    favicon 在未指定 favicon 时,大多数浏览器会请求 Web Server 根目录下的 favicon.ico .为了保证 favicon 可访问,避免404,必须遵循以下两种方法之一: ...

随机推荐

  1. 李洪强iOS开发Swift篇---12_NSThread线程相关简单说明

    李洪强iOS开发Swift篇---12_NSThread线程相关简单说明 一 说明 1)关于多线程部分的理论知识和OC实现,在之前的博文中已经写明,所以这里不再说明. 2)该文仅仅简单讲解NSThre ...

  2. 使用php-emoji类让网页显示emoji表情

    需要的材料: php-emoji类库的下载地址:https://github.com/iamcal/php-emoji 代码示例:(该代码来自官网) <?php include('emoji.p ...

  3. Android Training精要(一)ActionBar上级菜单导航图标

    Navigation Up(ActionBar中的上级菜单导航图标) 在android 4.0中,我们需要自己维护activity之间的父子关系. 导航图标ID为android.R.id.home @ ...

  4. 虚拟机安装了ubuntu,忘记密码修复

    在虚拟机中按照以下步骤重新为用户设定新密码. 重启Ubuntu,随即长按shift进入grub菜单: 选择recovery mode,回车确认: 在Recovery Menu中,选择“Root Dro ...

  5. linux权限掩码

    我的博客:www.while0.com 主要是在新建文件或目录的时候,控制新文件或目录的默认权限. 文件:新建文件默认没有x权限,故新建文件在umask为000时最大权限是666. 目录:新建目录默认 ...

  6. android-86-Can't create handler inside thread that has not called Looper.prepare()

    以下是Android API中的一个典型的Looper thread实现: //Handler不带参数的默认构造函数:new Handler(),实际上是通过Looper.myLooper()来获取当 ...

  7. UVA_1025_A_Spy_in_the_Metro_(动态规划)

    描述 https://uva.onlinejudge.org/index.php?option=com_onlinejudge&Itemid=8&page=show_problem&a ...

  8. WordPress get_allowed_mime_types函数(wp-includes/functions.php)存在跨站脚本漏洞

    漏洞版本: WordPress 3.6 漏洞描述: CVE ID:CVE-2013-5738 WordPress是一种使用PHP语言开发的博客平台,用户可以在支持PHP和MySQL数据库的服务器上架设 ...

  9. 开源(免费)三维 GIS(地形,游戏) 续1

    转自:http://www.cnblogs.com/xiexiaokui/archive/2009/04/02/1428525.html 转自 三维数字地球发布平台探索--几款开源软件介绍 http: ...

  10. Ajax在PC端可以使用但在手机端不能使用

    ajax代码如下,仔细看看也没有什么错,电脑端可以调用并正确的返回结果,手机端却不可以 function GetSumData(time) { var device = "Phone&quo ...