浏览器tab页签上的title图标favicon.icon

2024-05-20 14:03:07

文章目录

浏览器tab页签上的title图标favicon.icon
- 什么是favicon？
- 如何查看favicon
- 在线生成favicon
- 浏览器tab页签上的title图标如何设置

浏览器tab页签上的title图标favicon.icon

什么是favicon？

Favicon是favorites icon的缩写，亦被称为website icon（网页图标）、page icon（页面图标）或urlicon（URL图标）。Favicon是与某个网站或网页相关联的图标。

Favicons是小的16x16图标文件，在浏览器地址栏中在网站的URL旁边显示。此外，它们通常在用户的“打开”选项卡和书签列表列表中显示在您网站的名称旁边，从而使用户更容易在其他网站之间快速识别。

如何查看favicon

直接在网站的顶级域名外加上“/favicon.ico”即可看到。

Favicon图标上传到网站的主目录或根目录。默认位置为yourwebsite.com/favicon.ico同样浏览器会首先在网页所在目录默认位置寻找favicon.ico文件。

在线生成favicon

现在网上有在线favicon生成器服务：直接上传你喜欢的图片，直接生成16*16像素的favicon.ico文件，还有在线预览功能。

在线生成favicon网址：https://www.favicon-generator.org/

所有版本的Internet Explorer仍然需要将Favicons保存为ICO文件（Microsoft Icon格式）。该工具提供了一种简便的方法，可以将所有现代Web浏览器支持的任何GIF，PNG或JPEG转换为ICO。它还使您可以通过方便的在线编辑从头开始创建Favicons。

浏览器tab页签上的title图标如何设置

浏览器tab页签上的title图标可以由html页面里的标签指定，如：

<html><head><link rel="icon" href="/my.ico"></head><body>...<body>
</html

如果在html页面里没有指定这个图标，则浏览器会自动寻找网站根目录的favicon.ioc文件。如果存在则显示，不存在则不显示。

需要注意的是，如果更换或者删除了这个图标，要清空浏览器缓存才能生效。

浏览器tab页签上的title图标favicon.icon相关推荐

Axure 9 实战案例，母版的应用 2，运用母版交互绘制Tab页签
前言 Hello!欢迎来到Axure 9 实战案例教程专栏.点击了解课程简介>> 上一篇教程我们讲解了运用母版绘制微信APP的导航菜单(点击阅读该教程>>),本篇教程我们继续来 ...
chrome浏览器多页签唯一关闭时自动注销
chrome浏览器多页签唯一关闭时自动注销整体思路多页签唯一思考探索window对象name的属性 window.name的特征页签唯一实现页签间共享信息思考页签数量的管理实现监听chr ...
js 点击按钮打开浏览器新页签，兼容版
话不多说直接上代码,这是千辛万苦寻来的,帮助需要帮助的人. <html><head>点击按钮打开浏览器新页签</head><body><div o ...
浏览器Tab页切换事件
浏览器Tab页切换事件 /**** 浏览器Tab页切换事件*/ document.addEventListener('visibilitychange',function(){if(document. ...
Vue头部菜单,点击菜单新增tab页签
Vue头部菜单,点击菜单新增tab页签 <template> <div class="wrapper"> < ...
antd-pro v5版本的tab页签最简实践
antd-pro v5版本的tab页签最简实践前言网上找了很多资料,也看了好些个代码,总觉得他们写的太累赘了.其实官方自己也说了,antdpro做页签和他们的产品理念不符合才不做,但是不代表他们没 ...
如何动态为 tabstrip 中的 tab 页签指定标题
网上居然搜不到相关的文章,所以我来写一篇吧. 其实就是两个要点,只要注意就行了. 首先,最重要的一点,在绘制屏幕的时候,给 tab 页签的属性指定为"输出字段",这时,它的&quo ...
Bootstrap tab页签刷新加载不显示，只有点击其他标签后第一个才显示
Bootstrap tab页签刷新加载不显示,只有点击其他标签后第一个才显示解决方法: 在tab-content里面的tab-pane中添加active  < ...
利用vuex关闭当前tab页签
在vuex的js文件中写如下方法:(如果没有vuex的js文件,可以自己写一个,参考另外一篇文章,讲解vuex的) /*** @class closeNow* @description 关闭当前界面页 ...

最新文章

热门文章