`

如何添加网站的浏览器 ico 图标

阅读更多

什么是网站 ICO 图标?

  打开微软、百度等网站后看到浏览器的标题栏、地址栏,多浏览器的标签上都显示了一个小图标,如 ,这里说的就是这个东东。

  如何制作 ICO 图标?

  这里使用最简单的办法。因为 ico 格式图片比较特殊,一般软件(如 Windows 自带的画图、Adobe Photoshop 等)都制作不了,我们就分两步做。

  第一步是用 Windows 自带的画图或 Adobe Photoshop 制作一个 ico 的原图,格式可以是 jpg / jpeg / gif / png 等,大小大概在 32*32 像素差不多,最好是 16px×16px 的,因为浏览器标题栏和地址栏上显示的就是这个尺寸。

  第二步是将制作好的 ico 原图转换为 ico 格式,制作好后去一个可以在线转换 ico 格式的网站(百度一下会有不少,也可以下载一个转换软件进行处理)。这里推荐 http://www.bitbug.net/ ,打开该网站后界面很清晰明了,经数秒简单的处理即可转换为我们要的 ico 格式图标文件,文件被自动命名为 favicon.ico

  这样 ico 图标就制作完成了。

  如何让 ICO 图标在网站上显示?

  先将转换好的 ico 图标文件上传到网站任意目录,一般为根目录。以我的为例,我上传到 /bbs 目录下,也就是说 ico 文件的路径是 /bbs/favicon.ico

  然后在需要显示该图标的页面模板头部(<head> 与 </head> 之间)插入以下代码:

<link rel="Shortcut Icon" href="/bbs/favicon.ico">

  如果你的模板是 XHTML 规格的,代码应该是:

<link rel="Shortcut Icon" href="/bbs/favicon.ico" />

 

分享到:
评论

相关推荐

    浏览器 图标总汇 ico + png

    在Web开发中,ICO文件常用于网站的favicon,即浏览器地址栏上的小图标,帮助用户快速识别和区分不同的网站。 PNG,全称Portable Network Graphics,是一种无损压缩的位图格式,支持透明度和索引色。相比于ICO,PNG...

    网站浏览器导航图标favicon.ico

    在“网站浏览器导航图标favicon.ico”这个主题中,我们将深入探讨如何创建和设置这个特殊的图标。 favicon.ico 文件格式: Favicon 图标通常是 ICO 格式的,这是一种支持多种尺寸和颜色深度的图像文件格式,特别...

    ICO图标打包下载

    ICO图标是一种特殊的图像文件格式,主要用于计算机操作系统中的应用程序和网站,以表示文件、文件夹、快捷方式等。这种格式能够支持多种分辨率,使得图标在不同的显示尺寸下保持清晰。ICO文件通常包含多个不同大小和...

    word的ICO图标

    在IT领域,ICO图标是一种特定的图像文件格式,主要用于应用程序和网站的图标。这些图标可以在操作系统的桌面上、文件夹中或浏览器的地址栏里看到,通常包含多种尺寸和颜色深度,以适应不同设备和视图环境。"word的...

    ico精品系统ico图标大全

    2. **网页favicon**:ico图标也常被用作网页的favicon,显示在浏览器标签页或收藏夹中,提升网站的辨识度。 3. **系统图标**:操作系统内部的文件类型、设备、设置等都有一套相应的ico图标,如硬盘、网络、电源等。 ...

    ico图标集合.zip

    - 网站 favicon:在浏览器的地址栏、书签和标签页上,ico图标作为网站的识别标志。 - 文件类型图标:操作系统会为不同类型的文件分配特定的ico图标,帮助用户快速识别文件类型。 5. **创建与编辑ico图标**: - ...

    ico图标,常用ICO图标

    ICO图标是一种特殊的图像格式,主要用于网站的 favicon,即浏览器地址栏、书签和标签页上显示的小图标。这种图标能够使网站在众多网页中脱颖而出,提升品牌形象和用户体验。ICO 文件可以包含多种尺寸和颜色深度,以...

    软件ico图标大全 软件ico图标大全

    ico图标是计算机应用程序中常见的图标格式,主要用于标识软件、网站或者操作系统中的文件和程序。它是一种包含多种尺寸和颜色深度的图像文件,确保在不同分辨率和设备上都能清晰显示。在Windows系统中,ico文件被...

    ICO图标生成器 ICO图标生成器

    ICO图标生成器是一种工具,主要用于将图像文件转换成ICO格式,这种格式是Windows操作系统中用于桌面图标的标准。本文将深入探讨ICO图标生成器的工作原理、使用方法以及它在IT领域中的重要性。 首先,理解ICO文件...

    水晶图标 ICO图标 超漂亮ICO图片

    在Web开发中,ICO文件也被用作网站的favicon,显示在浏览器的地址栏和书签中,增强网站的品牌识别度。 总结来说,"水晶图标 ICO图标 超漂亮ICO图片"代表了一种美观、高质量的图标设计风格,这些图标在Windows系统中...

    为网站添加网站图标ico,动画图标gif(在浏览器地址栏中显示).zip

    网站图标(Favicon)是网页的一种重要组成部分...总的来说,为网站添加ICO图标和GIF动画图标是一个相对简单的过程,但要注意兼容性和浏览器的差异。正确设置和优化Favicon可以提升用户体验,增加网站的专业感和辨识度。

    常用的ico图标大全

    ico图标是一种特殊的图像格式,主要用于网站的favicon,也就是浏览器地址栏前面的小图标,以及桌面快捷方式的图标。这种格式能够包含多个不同尺寸和颜色深度的图像,以适应不同的显示环境。在Windows操作系统中,ico...

    ICO图标大全,十万个电脑图标

    ICO图标是一种特殊的图像格式,主要用于计算机软件、网站和操作系统中,作为可识别的标识符。它们通常是16x16像素或32x32像素的尺寸,但也可能包含多种大小,以适应不同的屏幕分辨率和显示需求。"ICO图标大全,十万...

    ICO图标大全@全系列最全的ico图标集,包罗万象!

    ICO图标,全称为“Icon Image File”,是一种用于存储多种分辨率和格式的小型图像文件,主要用于计算机操作系统的应用程序、文件和网站。ICO图标集是设计师们为各种用途精心制作的一组图标资源,通常包含多种尺寸和...

    ico图标截取器

    同时,对于网站开发者,ico图标是网页头部的favcion(书签图标),ico图标截取器能方便地将网站logo转化为ico格式,使网站在浏览器标签页上具有独特的识别度。 总的来说,"ico图标截取器"是一款高效且用户友好的...

    ico图标素材下载,ico

    ico图标是一种特殊的图像格式,主要用于网站的favicon,也就是浏览器地址栏前的小图标,以及桌面快捷方式的图标。这种格式能够将多个分辨率的图像合并到一个文件中,以便在不同的设备和屏幕上显示合适的尺寸。ico...

    ico图标大全.zip

    ico图标大全.zip这个压缩包文件包含了丰富的ICO图标资源,这些图标是互联网上常见的图标格式,主要用于网站的favicon,即浏览器地址栏前的小图标。ICO文件是一种特殊的图像格式,它可以包含多个不同尺寸和颜色深度的...

    favicon.ico 图标大全

    【favicon.ico 图标大全】是为了解决网页标识问题而提供的资源集合,它包含了各种流行、个性化的图标设计,适用于不同网站的需求。Favicon(Favorites Icon)是网站的图标,通常显示在浏览器的地址栏、书签栏以及...

    PNG-ICO 图标格式互转工具

    - 网页设计师:为了保证网页在各种浏览器上的视觉一致性,可能需要将ICO图标转换为PNG格式。 总的来说,“PNG-ICO 图标格式互转工具”是一个实用的辅助软件,帮助用户方便快捷地在两种格式间切换,满足不同场景下...

    ICO 图标 ico 图片

    ICO图标是一种特殊的图像格式,主要用于计算机软件、网站和操作系统中,作为可识别的程序或功能标识。这种格式的图标能够包含多个分辨率和颜色深度的图像,以适应不同的显示环境,如高分辨率显示器或低分辨率图标...

Global site tag (gtag.js) - Google Analytics