备案控制台
开发者社区 开发与运维 文章 正文

前端如何设置浏览器网页标签页前的小图标favicon.ico

2022-11-14 975
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介： 前端如何设置浏览器网页标签页前的小图标favicon.ico

步骤1：

将小图标favicon.ico文件（或者普通的icon小图片）放在项目的public或者static目录下

步骤2：

index.html代码中设置favicon.ico

favicon.ico文件<linkrel="icon"href="%PUBLIC_URL%/favicon.ico"/>或普通icon图片<linkrel="icon"href="%PUBLIC_URL%/logo.png"/>

image.png

下面的小工具，可以用来将图片转化为icon格式的图片，而且会生成对应的html代码，还是挺方便的。

https://www.favicon-generator.org/

文章标签：
前端开发
关键词：
浏览器图标
浏览器设置
浏览器网页
前端网页
前端设置
Boale_H
目录
相关文章
愿天堂没有BUG（公众号同名）
|
12天前
|
前端开发 安全 UED
【项目实战】从终端到浏览器：实现 ANSI 字体在前端页面的彩色展示
在学习和工作中，我们经常需要使用日志来记录程序的运行状态和调试信息。而为了更好地区分不同的日志等级，我们可以使用不同的颜色来呈现，使其更加醒目和易于阅读。 在下图运行结果中，我们使用了 colorlog 库来实现彩色日志输出。通过定义不同日志等级对应的颜色，我们可以在控制台中以彩色的方式显示日志信息。例如，DEBUG 级别的日志使用白色，INFO 级别的日志使用绿色，WARNING 级别的日志使用黄色，ERROR 级别的日志使用红色，CRITICAL 级别的日志使用蓝色。
愿天堂没有BUG（公众号同名）
18 1
游客5fdji2pvmf8888
|
10天前
|
缓存 前端开发 JavaScript
如何优化前端网页加载速度
本文将介绍一些优化前端网页加载速度的技巧和方法，包括减少HTTP请求、压缩文件大小、使用浏览器缓存以及异步加载等。通过这些优化措施，您可以提升用户体验，加快网页加载速度，为用户提供更好的网页访问体验。
游客5fdji2pvmf8888
18 6
米诺斯
|
7天前
|
Shell
5.Electron之shell(使用系统默认浏览器打开网页)
5.Electron之shell(使用系统默认浏览器打开网页)
米诺斯
30 1
1234893578710685
|
13天前
|
JavaScript 前端开发
WebView2 控件（基于 Microsoft Edge (Chromium) 的嵌入式浏览器控件），获取网页加载后的标题
在使用 WebView2 控件（基于 Microsoft Edge (Chromium) 的嵌入式浏览器控件）时，要获取网页加载后的标题，可以监听 WebView2 的 NavigationCompleted 事件。这个事件被触发时，表示导航已完成，此时执行JavaScript代码可以安全地获取网页的标题。
1234893578710685
22 0
WebView2 控件（基于 Microsoft Edge (Chromium) 的嵌入式浏览器控件），获取网页加载后的标题
你都不懂
|
19天前
|
前端开发 JavaScript 开发工具
Web网页前端教程免费：引领您踏入编程的奇幻世界
Web网页前端教程免费：引领您踏入编程的奇幻世界
你都不懂
18 3
她说她一如既往的爱我
|
26天前
|
JavaScript
Vue - 超强实现网页禁止浏览器缩放功能
Vue - 超强实现网页禁止浏览器缩放功能
她说她一如既往的爱我
50 4
游客762btuqu5wybw666
|
1月前
|
前端开发 JavaScript 缓存
如何优化前端网页加载速度
网页加载速度是用户体验和SEO排名的重要指标之一。本文将探讨如何通过优化前端代码、资源加载和网络请求等方面来提高网页加载速度，从而提升用户满意度和网站流量。
游客762btuqu5wybw666
18 4
wjq++
|
13天前
|
缓存 网络协议 网络安全
使用浏览器浏览网页时发生了什么？
使用浏览器浏览网页时发生了什么？
wjq++
11 0
1941623231718325
|
2月前
|
Web App开发 前端开发 JavaScript
构建跨浏览器兼容的前端应用：技术实践与挑战
【5月更文挑战第16天】构建跨浏览器兼容的前端应用是应对浏览器差异和多样性的挑战。使用现代框架（如React、Vue）能自动转换代码，编写可移植的Web标准代码，结合浏览器兼容性测试工具和Polyfill解决旧浏览器支持问题。关注浏览器更新，应对性能、API差异和样式问题，采用渐进增强、条件判断和CSS Reset策略确保应用在各种浏览器上运行良好。
1941623231718325
40 2
青玉白露
|
2月前
|
前端开发 JavaScript 搜索推荐
前端网页手册(2)--菜鸟教程网站分析
前端网页手册(2)--菜鸟教程网站分析
青玉白露
27 2