首先，我們新認識一下，什么是相對路徑和絕對路徑。
什么是絕對路徑：
網站中類似以https://www.baidu.com/img/bd_logo1.png來確定文件位置的方式也是絕對路徑。另外，在網站的應用中，通常我們使用"/"來表示根目錄，/img/bd_logo1.png就表示bd_logo1.png文件在這個網站的根目錄上的img目錄里。
相對路徑就是以當前文件為基准進行一級級目錄指向被引用的資源文件。
../ 表示當前文件所在的目錄的上一級目錄
./ 表示當前文件所在的目錄(可以省略)
什么是相對路徑：
讓我們先來分析一下為什么會發生圖片不能正常顯示的情況。舉一個例子，現在有一個頁面index.htm,在這個頁面中聯接有一張圖片bd_logo1.png。他們的絕對路徑如下：
C:/Users/Administrator/Desktop/bd_logo1.png
如果你使用絕對路徑C:/Users/Administrator/Desktop/bd_logo1.png，那么在自己的計算機上將一切正常，因為確實可以在指定的位置即C:/Users/Administrator/Desktop/bd_logo1.png上找到bd_logo1.png文件，但是當你將頁面上傳到網站的時候就很可能會出錯了，因為你的網站可能在服務器的c盤，可能在d盤，也可能在aa目錄下，更可能在bb目錄下，總之沒有理由會有c:/website/img/bd_logo1.png這樣一個路徑。那么，在index.htm文件中要使用什么樣的路徑來定位bd_logo1.png文件呢？對，應該是用相對路徑，所謂相對路徑，顧名思義就是自己相對與目標位置。在上例中index.htm中聯接的bd_logo1.png可以使用img/bd_logo1.png來定位文件，那么不論將這些文件放到哪里，只要他們的相對關系沒有變，就不會出錯。
下面舉個簡單的例子（絕對路徑比較簡單就不舉例子了，先按相對路徑的舉一下例子）：
1，在桌面建了一個文件夾abc,目錄結構為
2，現在用index.html分別去加載 兩張圖片bd_logo1.png和t01e92920a7b90351cc.png
index.html代碼為：
index.html效果為：
3，用2.html去分別去加載 兩張圖片bd_logo1.png和t01e92920a7b90351cc.png
2.html代碼為：
2.html的效果為：
把文件夾abc搬到E盤目錄下還是能正常打開的：
