网站favicon图标查看、制作及使用方法总结

最新推荐文章于 2024-08-21 17:20:40 发布

置顶 jackie_bobo

最新推荐文章于 2024-08-21 17:20:40 发布

阅读量2.6k

点赞数 1

分类专栏： HTML 文章标签： favicon查看 favicon制作 web前端开发 favicon使用

本文链接：https://blog.csdn.net/jackie_bobo/article/details/78453362

版权

HTML 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

收藏夹图标就是出现在浏览器地址栏左侧的那个小图标。收藏夹图标，也作网站头像。当然，这不仅仅是收藏夹图标的全部，根据浏览器的不同，收藏夹图标显示也有所区别：在大多数主流浏览器如FireFox和Internet Explorer (5.5及以上版本)中，收藏夹图标不仅在收藏夹中显示，还会同时出现在地址栏上，这时用户可以拖曳收藏夹图标到桌面以建立到网站的快捷方式；除此之外，标签式浏览器甚至还有不少扩展的功能，如FireFox甚至支持动画格式的收藏夹图标等

favicon查看方法

已知网站的地址的时候，一般favicon都是放在网站的根目录，所以直接在网站的根目录下输入网址/favicon.ico 即可查看该网站的favicon图标，如下图：
favicon的查看方法

网站 favicon icon制作方法

关于网站icon图标制作，个人比较喜欢在线的favicon icon图标制作网站—-比特虫，使用方法里面写的很详细，如下图：

favicon icon图标使用方法

当成功生成favicon.ico图像文件后,浏览器会自动弹出一个zip的压缩文件将压缩文件中的favicon.ico图像放在根目录下(也可以是其他目录)
在页面源文件的标签之间引入，代码如下：

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <link rel="stylesheet" type="text/css" href="css/index.css" />
        <link rel="shortcut icon" href="/favicon.ico" />
       <!-- Shortcut Icon 就是在网址列/标题前面出现的Icon  -->
    </head>
    <body>

    </body>
</html>