**相對路徑：就是相對于自己的目標文件的位置。（指以當前文件所處目錄而言文件的位置）————以引用文件之間網頁所在位置為參考基礎，而建立出的目錄路徑。因此當保存于不同目錄的網頁引用同一個文件時，所使用的路徑將不相同，故稱之為相對。**
#### 相對路徑的問題，我們需要先明白幾個概念
**/、./、../、../../**
* `/`這個斜杠代表的是根目錄的意思，什么是根目錄呢？
**先看例子：**
~~~
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
~~~
> 第四個?`../../`? ? ? ? ?這個代表的是返回到上一級，再向上返回一級，返回了兩級；
> 第五個?`../../../`? ? ? 這個比上面的多了一級，那么就是向上返回三級了；
