欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

如何制作并使用ico图标呢?

程序员文章站 2022-03-31 20:02:24
...

什么是ico图标,通俗的讲就是我们打开一个网站的时候,比如说淘宝网,它会在网页的前面显示他们的图标,这个ico不是图片,所以需要用第三方网站来生成,具体如下:

                   如何制作并使用ico图标呢?

那么如何来制作这种小图标呢?

1.首先我们要准备好自己事先做好的图片,当然这个图片很小,不能太大,因为我们用到的就是很小的图片。

2.接下来我们需要把图片转化为ico图标,我们需要借助第三网站http://www.bitbug.net/ 比特虫,这个软件是完全免费的。

3.对的,就是这个软件,选择我们的文件图片,然后尺寸的话你自己选就行,淘宝的好像是16×16,写上附加码,点击生成ico图标即可。如何制作并使用ico图标呢?

4.接下来我们该使用这个ico图标了,首先把你生成的xxxx.ico图标放到我们项目的根目录下,一定要放在根目录下,然后在我们的HTML的<head></head>标签之间引入一段代码:如图所示

<!-- 引入facicon.ico网页图标,直接放入根目录下-->
		<link rel="shortcut icon" type="image/x-icon" href="favicon.ico"/>

如何制作并使用ico图标呢?

5.然后就可以了。注意的是它不是一个图片,它是显示在浏览器中一种图标

相关标签: 前端的那些东西