给自己的网页制作一个网页图标

昨天我在做一个用Node.js搭建一个简单服务器的练习时,遇到了一个问题,就是前端的网页在向后端做数据请求时,除了我们用户所做的基本请求以外,浏览器一般会默认自带的向服务器发送另外一个请求,也就是我们熟知的"/favicon.ico"请求,一般像这样:
Alt我们都知道,这个请求是浏览器向服务器自带发出的网页图标请求,所谓的网页图标,就是像这些东西:
Alt而我们自己写的网页一般都没有这个网页图标,所以经常会请求失败,这个请求失败不会影响网页的加载,但会在每次访问网页时,后端Node.js的命令行里会提示一个"error!",有时还会在一些特殊情况下影响后端代码运行,所以我们通常会有几种方法来阻止这种情况发生,比如
方法一:在服务器运行代码主体中添加一个if条件语句,像这样:
Alt就能阻止后端接受图标请求;
方法二:在前端网页代码的中引入一个空的图标地址,像这样:
Alt代码附在这里:<link rel="icon" href="data:;base64,=">,当然呢,还是有很多其他方法来屏蔽的…
原本的我就是打算屏蔽掉"/favicon.ico"请求的,但不知怎的就诞生出一个想法,为何不给自己搞一个专属于自己的网页图标呢?虽然好像对学习写代码帮助不大,但偶尔小小的装个逼想想还是蛮酷的,再说万一某一天这种平时没什么用的小东西还能派上大用场呢,正所谓,行走江湖,技多不压身嘛,以下就给大家奉上制作过程,相当简单,看一遍就会的那种:

需要软件: PS

这个我想大家都会有的吧,来,接下来让我们开始:
1).首先,打开我们的PS,点击左上角"文件",再点击"新建";
Alt2).然后我们设定一下画布;
Alt名称自己定义,长宽我定的是100×100px,背景也可以选,我定的是白色,配置好后点击确定;
3).接下来就是你的随意施展时间了,在这块画布上尽情释放你的艺术天分吧;
4).艺术创作结束后,只要保存就好了,继续点击左上角"文件",然后再点击"存储为";
Alt5).选择好存储地址,配置好文件名与文件格式,其他不用做修改,点击保存;
Alt6).默认就是第一个,直接点击"OK";
Alt
7).如果在保存时没有将图片保存到自己的项目文件夹中的话,这一步就需要将制作好的图标文件挪到自己的项目文件夹中,否则浏览器可能会获取不到;
8).最后一步,引入图标文件,在html代码中引入自己制作的图标文件:
Alt这里的路径填写上一步图标文件放置的路径即可;
OK,到这里就结束了,你的专属网页图标就这样出炉了,相当简单有没有?
Alt装逼小本领喜+1,红红火火恍恍惚惚…

猜你喜欢

转载自blog.csdn.net/weixin_46166330/article/details/104456143