怎么在vue项目中的浏览器网页标题添加小图标

1.项目需求:在网页标题处添加小图标

如下所示

 

2.在Vue项目文件夹目录中找到index.html

如下所示

3.将所需图标放在static目录下

如下所示

为什么放在static目录下,而不是放在src目录下呢?

因为放在src下浏览器会找不到的,网页把根域名作为相对文件的根目录了,但是我们的文件的路径是相对于我们的项目文件的根目录的,因此找不到了。

反正不用管这么多了,不放在src下就是因为浏览器找不到,找不到就加载不了,就不会有效果

还有这里推荐大家用.ico格式的图标,而不是.jpg和.png格式的图片,改个格式而已,不紧要的。为什么这样用呢?因为方便,省空间。

4.在index.html的head标签中添加<link rel="icon" type="image/x-icon" href="static/favicon.ico" />

如下所示

5.保存,启动项目检查效果

ok,fine

  • 1
    点赞
  • 0
    评论
  • 8
    收藏
  • 一键三连
    一键三连
  • 扫一扫,分享海报

©️2021 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值