用DW寫HTML的時候，可以直接選擇到具體檔案的路徑，現在改用了webstorm，只能選擇到與HTML檔案同一目錄下的檔案。下面是小編為大家整理的網頁製作絕對路徑與相對路徑的區別講解，歡迎參考~
1.絕對路徑
先說在本地計算機上，檔案的絕對路徑當然是指：檔案在硬碟上真正存在的路徑。
例如這個路徑：D:/wamp/www/img/icon.jpg告訴我們icon.jpg檔案是在D盤的wamp目錄下的img子目錄中。我們不需要知道其他任何資訊就可以根據絕對路徑判斷出檔案的位置。
還有超連結檔案位置，也屬於絕對路徑，例如http://www.img.net/img/icon.jpg 。
注意：有時候編好的頁面，在自己的計算機上瀏覽一切正常，但是上傳到Web服務器上瀏覽就很有可能不會顯示圖片了。因為靜態HTML頁面需要上傳到網站，而在網站的應用中，通常我們使用"/"來表示根目錄，/img/icon.jpg就表示photo.jpg檔案在這個網站的根目錄上的img目錄裡。但是要知道，這裡所指的根目錄並不是你的網站的根目錄，而是你的網站所在的Web伺服器的根目錄。因為上傳到Web伺服器上時，可能整個網站並沒有放在Web伺服器的D盤， 有可能是F盤或H盤。即使放在Web伺服器的D盤裡，Web伺服器的E盤裡也不一定會存在“D:/wamp/www/img”這個目錄，因此在瀏覽網頁時是不會顯示圖片的。這也是應用絕對路徑的風險。
2.相對路徑
相對路徑，顧名思義就是自己相對與目標位置。
假設 你要引入檔案的頁面名稱為test.htm，它存在叫www的資料夾裡(絕對路徑D:/wamp/www/test.htm)，那麼引用同時存在www資料夾裡的'“icon.jpg”檔案(絕對路徑D:/wamp/www/icon.jpg)，同一目錄下相對路徑icon.jpg;如果檔案“icon.jpg”存在img文資料夾中(絕對路徑D:/wamp/www/img/icon.jpg)，那麼相對路徑img/icon.jpg。
相對路徑可以避免上述根目錄不同的問題。只要將網頁檔案及引用檔案的相對位置與web伺服器上檔案相對位置儲存一致，那麼他們的相對路徑也會一致。例如上面的例子，“” 檔案裡引用了“icon.jpg”圖片，由於“icon.jpg”圖片相對於“”來說，是在同一個目錄的，那麼只要這兩個檔案還是在同一個目錄內，那麼無論上傳到Web伺服器的哪個位置，在瀏覽器裡都能正確地顯示圖片。
注意：相對路徑使用“/”字元作為目錄的分隔字元，而絕對路徑可以使用“”或“/”字元作為目錄的分隔字元。由於“img”目錄是“www”目錄下的子目錄，因此在“img”前不用再加上“/”字元。
在 相對路徑裡常使用“../”來表示上一級目錄。如果有多個上一級目錄，可以使用多個“../”。假設 “test.htm”檔案所在目錄為“D:/wamp/www/test.htm”，而“icon.jpg”圖片所在目錄為“D:/wamp/www”，那 麼“icon.jpg”圖片相對於“”檔案來說，是在其所在目錄的上級目錄裡，則引用圖片的語句應該為：
假設 “test.htm”檔案所在目錄為“D:/wamp/www/test.htm”，而“icon.jpg”圖片所在目錄為“D:/wamp/www”，那 麼“icon.jpg”圖片相對於“”檔案來說，是在其所在目錄的上級目錄裡的子目錄——“img”中，則引用圖片的語句應該為：
3.虛擬路徑
將檔案上傳到遠端伺服器後，這些檔案駐留在伺服器本地目錄樹中的某一個資料夾中。例如，在執行MicrosoftIIS的伺服器上，主頁的路徑可能如下所示：c:此路徑通常稱為檔案的物理路徑。但是，用來開啟檔案的URL並不使用物理路徑。它使用伺服器名稱或域名，後接虛擬路徑( 這裡說一下虛擬目錄：虛擬目錄，是對Http訪問而言的,使用者在瀏覽網站或FPT時顯示的目錄結構。例如你設定了E:Website為訪問目錄，那麼E:Website為虛擬目錄的根目錄;E:WebsiteImage,就變成了Image. )。所以接上面的例子，虛擬路徑可以寫成
整理一下
“./” 代表當前目錄
等同於
“../” 代表上一級目錄
“/” 當前根目錄，是相對目錄;
“~/” Web 應用程式根目錄。 啟用了 Web 應用程式根目錄運算子 (~)，在伺服器控制元件中指定路徑時，可以使用該運算子。 會將 ~ 運算子解析為當前應用程式的根目錄。可以結合使用 ~ 運算子和資料夾來指定基於當前根目錄的路徑。在該示例中，影象檔案將從 Web 應用程式根目錄下的 Images 資料夾中直接讀取，無論該頁面位於網站的什麼位置。
