在HTML与CSS的使用中，我们所用的元素时不时都会用到“路径”这一事项。
例如：在标签中使用的和标签中使用的，其中hre后面引号中的值就是输入路径的；同样在标签中使用的，其中scr后面引号中的值也是输入路径的……
那么问题来了，路径是什么呢？ ——就是你想要加入的内容的位置。
路径分为相对路径和绝对路径，那怎么区分呢？
简单来说，相对路径就是相对于当前文件的路径。而绝对路径就是你的主页上的文件或目录在硬盘上真正的路径。而网页中一般表示路径都使用这相对路径。
在相对路径中，分三类
ⅰ./：表示当前路径
ⅱ../：表示跳出当前文件夹
ⅲ：/：表示进入下一级文件夹
绝对路径:协议//域名/目录
那下面，我们就来区分一下吧！
如图所示，如果我们要在0304.html文件中在标签中使用链接到css文件夹中的0304.css文件，我们就需要用到相对路径将两个文件进行链接，那怎么进行链接呢？
因为0304.css文件在css文件夹中，而css文件夹和0304.html在同一层级，所以我们就要先在当前路径中选中css文件夹，然后在进入到css文件夹中找到的0304.css文件。 如图：
接下来，我需要诉说一下本人非常“惨不忍睹”的一次经历，当时是什么情况呢？
当时我们换了一个老师，她要求我们要将文件夹都分类放在一起，这是一个很好的建议。但是这个建议跟我接下来要说的事情有什么关系呢？
因为当时并没有相对路径这一概念，而在我们所写的页面中需要用到雪碧图，所以我们就需要在css文件中用到"background-image: url()"，而url后引号中的值就是需要输入路径。如图
我需要在0304.css文件中链接img文件夹中的02.png，然后我就按照往常那样输入“img/”，按理说是应该出现如下图所示的样式，后面应该直接有可以选中的选项
但出现的却是下面图片这样的样式，后面没有任何任何图片选项，于是我便把我要选中的图片名称手动输了进去，虽然左侧那一条的小图提示有那张图，但是打开页面时却没有任何图片，于是我来来回回就反复了好几次，各种调整也没有任何改变，问同桌他也不知道怎么回事，弄了半个来小时，我彻底emo了。
最后我同桌告诉我说要把css文件给移出来才可以选中，于是我就默默的将0304.css文件移出了css文件，然后成功了！！！当时就是一整个崩溃，就像下图所示的一堆可爱的小玩意在心里奔腾而过。心里想着：“这个老师怎么回事啊，本来什么事情没有的，搞到我今天为了这个bug弄这么简单的东西弄这么久！啊啊啊啊啊！！！！”
好了，第一篇章就这么过了。接下来，我们进入第二篇章……
后面，我们学习了路径这一知识，知道了相对路径与绝对路径的使用方式，脑海中也有了这一概念。但是……为什么还会有第二篇章呢？
那我就来给大家聊聊吧~
这周的最后一天的上午最后一节课，我们老师给我们了一个新的页面，让我们下午写，也是这周的作业，因为老师下午要开会。然后我就开始又开始码代码了，老师有规定，自己就默默又将文件归类了，觉得当时肯定是哪个位置出了问题。接着我写着写着就又到了熟悉的位置，我想你们应该都懂吧。那都学到了相对路径我就不会存在问题了啊，可重点就是，我没有意识到上次用不了是路径的使用问题，我又忘了！！！
如图，因为学了相对路径，一开始就直接输入./,但是出现的却是这样的！？？我又懵了
不应该呀，为什么是这样呢？我又又又懵了……
这会正好大家都去吃中午饭了，而“人菜瘾大”的我还在写着代码，教室只剩下了我和班里成绩很好的郑同学，于是又试了一两次的我极其好意思的终于向大佬问出了我的疑惑。
原画面是这样的：
我：那个，郑同学，就是后面不是需要插入雪碧图吗，然后在css文件中就需要到background-image，但是在url中我插入不了雪碧图。
郑同学：什么？
我：就是……（我还没来得及继续说）
他默默离开位置走到了旁边。
郑同学：怎么了？
我点到自己写的css文件添加雪碧图的位置。
我：就是不是要插入雪碧图吗，我在html中插入图片都没有问题，但是在css这插入就没有后面的选项，就算自己输出图片全称，旁边有小图提示，但是打开页面却什么都没有，链接不上，上一次也是这样，要把css文件移出来才行。
郑同学：我看看
于是他看了一下，点了一下旁边的总文件框便说：这里./只能在当前css文件夹里面选，但图片是在另外一个————img文件夹里面选，所有就应该用../
然后！成功了！！！
我：哦哦，好的，谢谢。
当时，我被自己无语住了……啊！！！我怎么回事啊，不是前两天才讲吗？怎么就又给忘了啊！！整个人都裂开了……呜呜呜……
言归正传，所以如果我们要在0304.css文件中链接img文件夹中的02.png，我们需要怎么做呢？
首先我们需要在0304.css文件中退出来，退到css文件夹，因为在0304文件夹中，css文件夹与img文件夹是同一层级的，所以我们就需要先用到../，后我们就可以选中同一级的img文件啦~
如图：
接着，我们需要进入到img文件夹中的02.png，所以就再选中该文件就可以啦
最后，来一波总结，最终链接就是这样啦！
所以相对路径的正确使用非常重要哦。
我也相信，经过这两个次的教训，我也一定不会再犯同样的错误啦！毕竟，事不过三嘛，嘻嘻~
