一次搞懂相對與絕對路徑
路徑種類
- 相對路徑:以當下檔案目錄為起始點
- 絕對路徑:從根目錄開始抓檔案的絕對位置
路徑種類 | 範例 | 說明 |
---|---|---|
絕對路徑 | file:///c:/img/logo.png |
電腦 C 槽下的一張圖片 |
絕對路徑 | https://www.yahoo.com.tw/img/logo.png |
一個網址下的圖片 |
絕對路徑 | /img/logo.png |
根目錄下的一張圖片 |
相對定位 | page.html |
同層目錄中的 html 檔 |
相對定位 | ./css/all.css |
同層目錄中的 css 資料夾,裡面的 css 檔 |
相對定位 | ../img/logo.png |
上一層目錄中的 img 資料夾,裡面的圖檔 |
路徑常見開頭
- . :同層,也可不寫
- ..:上一層
- / :根目錄
範例 a:以在自己電腦,新增 index.html 載入 CSS 為例子
- 相對路徑:
- 絕對路徑:/Users/gonsakon/github/testproject/0114/onlinePath/css/all.css