**相对路径：就是相对于自己的目标文件的位置。（指以当前文件所处目录而言文件的位置）————以引用文件之间网页所在位置为参考基础，而建立出的目录路径。因此当保存于不同目录的网页引用同一个文件时，所使用的路径将不相同，故称之为相对。**
#### 相对路径的问题，我们需要先明白几个概念
**/、./、../、../../**
* `/`这个斜杠代表的是根目录的意思，什么是根目录呢？
**先看例子：**
~~~
F盘中有个文件夹vue_bamboos和一张图片 test-me.png
vue_bamboos下有一个文件夹 a , a文件夹中有一个文件夹b;
b文件夹下有一个index.html文件；
F-------------------------------------------
vue_bamboos-------------------------
a--------------------------
b-----------------
index.html-
test-me.png-------------------------
index.html:显示一张图片test-me.png, 这里我们使用就是根目录，也就是我们项目目录的上一级，也就是 F 盘是我们的根目录；
注意，我们的项目目录是vue_bamboos，但是vue_bamboos不是根目录，它的上一级才是！！！
<body>
<img src="/test-me.png" alt="测试根目录">
</body>
~~~
* `/`这个代表的是当前目录，也就是和我们的index.html 在同一级上
**先看例子**
~~~
假设我们的项目目录：
F---------------------------------
vue_bamboos---------------
index.html------
test-me.png-----
<body>
<img src="./test-me.png" alt="测试当前目录">
<img src="test-me.png" alt="测试当前目录">
</body>
也就是说我们可以这样写 ./test-me.png 或者省略 ./ 也是可以的, 直接写 test-me.png
~~~
* `../` 这个代表的意思是返回到上一级目录；
**先看例子**
~~~
假设我们的项目目录：
F-------------------------------------
vue_bamboos-------------------
index.html----------
b------------------------------
test-me.png---
<body>
<img src="../b/test-me.png" alt="测试父目录">
</body>
也就是说我们先找到index.html所在的vue_bamoos这个文件夹，再在vue_bamoos文件夹的上级目录F盘中，找到b文件夹，最后找到test-me.png
~~~
> 第四个 `../../` 这个代表的是返回到上一级，再向上返回一级，返回了两级；
> 第五个 `../../../` 这个比上面的多了一级，那么就是向上返回三级了；
