RWD網頁切版(八){認識絕對路徑和相對路徑}

剛開始接觸網頁製作的人都不太瞭解路行的使用方式,這一篇來介紹一下何謂「相對路徑」和「絕對路徑」

path

常看到的路徑大概分成這兩種樣子:

絕對路徑:

001

絕對路徑是文件在網頁空間上的完整網址,通常是要從我們的網站連到外面的網站時會用到。

其中會包含網站的根目錄位置(網址) / 檔案所在的資料夾名稱 / 檔名

而資料夾位置會在我們建立網頁檔案時就一起決定。

相對路徑:

002

相對路徑是相對於目前檔案位置的路徑,簡單說就是從要放超連結或是要插入圖片的那個檔案出發,去尋找目標檔案的過程。

說明:(以本文頁首的檔案結構圖為例)

範例1:在index.html頁面裡加入一個超連結按鈕可以開啟history.html的頁面,那所得到的相對路徑會是這樣:

%e6%9c%aa%e5%91%bd%e5%90%8d-3

那就是從index.html出發 > 開啟about資料夾 > 開啟history.html

所以得到的路徑是:

about/history.html

範例2:在history.html頁面插入logo.jpg圖檔

004

那就是從history.html出開 > 退到上一層目錄../ > 開啟img資料夾 > 開啟logo.jpg圖檔

所以得到的路徑是:

../img/logo.jpg

其中../是退回一層,所以如果要退二層的話就是../../

 

Leave a Reply