FanMa 博客 包含了关于前端学习的一系列内容,涵盖了 HTML、CSS、JavaScript、TypeScript、React、Next.js 等全栈方面的学习笔记。博客以技术为核心,深入浅出地讲解了这些技术的基础概念、实际应用以及最佳实践,并且结合了博主的个人经验和实践经历进行分享,有助于读者更好地理解和掌握这些技术。如果你有前端学习的需求或者对这些技术感兴趣,那么 FanMa 博客 将是帮助你实现这些目标的绝佳资源。

使用 Next.js 创建元信息网站图标
- 289

前面的文章内容已经把网站图标的信息添加的代码里了,但是和标题一起添加上去的图标还没有显示出来,别急,接下来我们就把网站图标让它显示出来。

添加网站图标

在项目的根目录创建一个 public 文件夹,以这个名字命名的文件夹,就是 next.js 默认的资产文件夹。然后在 public 文件夹下面再建立一个 favicon 文件夹,把我们的网站图标 favicon.ico 文件放进 favicon 文件夹里就可以了。最后回到浏览器,刷新一下刚才的网页,这时候就能看到网站图标显示在浏览器标题栏里了。

在这里给大家分享一个在线制作网站图标的网站: https://favicon.io/ ,在这个网站上你可以很轻松地制作精美的网站图标来。它不可以制作 favicon.ico.ico 格式的图标,还可以制作 .png 格式的网站图标。