简单记录一下在前端项目中,如何替换浏览器页签上显示的小图标。

  1. 首先找到项目的 html 文件。在此文件中可以修改网页的标题、图标等。
  2. head 标签内部找到对应图标的 link 标签。( link 标签用来定义文档和外部资源的关系)
  3. 想要替换浏览器图标,我们就需要对 link 标签做些修改。
    • 浏览器图标的默认格式是ico,若提供了对应的ico图标,则将图标放于public文件夹下,替换 href 属性中的图标名称
    • 若未提供ico图标,且个人不会转换ico格式,也可以使用png或其他格式的图片,此处需要替换两处
      • 首先需要指定 link 标签的 type 属性,type 属性规定了被链接文档的MIME类型,此处我们指定为所要替换的图片格式,例如image/png
      • 之后,将图标文件放于public文件夹下,并修改 link 标签 href 属性的图标名称及对应后缀

至此,浏览器页签图标的替换工作就结束了。

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐