HTML 文件路徑

徑描述

<img src="picture.jpg">

picture.jpg 位于與當前網(wǎng)頁相同的文件夾

<img src="images/picture.jpg">

picture.jpg 位于當前文件夾的 images 文件夾中

<img src="/images/picture.jpg">

picture.jpg 當前站點根目錄的 images 文件夾中

<img src="../picture.jpg">

picture.jpg 位于當前文件夾的上一級文件夾中

HTML 文件路徑

文件路徑描述了網(wǎng)站文件夾結(jié)構(gòu)中某個文件的位置。

文件路徑會在鏈接外部文件時被用到：

網(wǎng)頁
圖像
樣式表
JavaScript

絕對文件路徑

絕對文件路徑是指向一個因特網(wǎng)文件的完整 URL：

實例

對路徑-以引用文件之網(wǎng)頁所在位置為參考基礎(chǔ)，而建立出的目錄路徑。因此，當保存于不同目錄的網(wǎng)頁引用同一個文件時，所使用的路徑將不相同，故稱之為相對。

絕對路徑-以Web站點根目錄為參考基礎(chǔ)的目錄路徑。之所以稱為絕對，意指當所有網(wǎng)頁引用同一個文件時，所使用的路徑都是一樣的。
其實絕對路徑與相對路徑的不同之處，只在于描述目錄路徑時，所采用的參考點不同。由于對網(wǎng)站上所有文件而言，根目錄這個參考點對所有文件都是一樣的，因此，運用以根目錄為參考點的路徑描述方式才會被稱之為絕對路徑。　

　　以下為建立路徑所使用的幾個特殊符號，及其所代表的意義。

　　“.”–代表目前所在的目錄。

　　“..”–代表上一層目錄。

　　“/”–代表根目錄。

例：假設(shè)讀者所建立的Web站點擁有如下圖所示目錄路徑。假若要在Ref.htm文件中引用BeRef.gif文件時，其相對路徑如下：
　　./SubDir2/BeRef.gif
上面的引用路徑中，”.”代表目前的目錄(Dir1)，所以”./SubDir2”代表目前目錄下的SubDir2。其實，也可以省略”./”直接用這個式引用。

　　SubDir2/BeRef.gif

　　若使用絕對路徑以根目錄為參考點引用該文件時，引用路徑如下：

　　/Dir1/SubDir2/BeRef.gif

　　如果Web站點的目錄之結(jié)構(gòu)如下圖示:

　　引用BeRef.gif文件的相對路徑又是如何呢?假若要在Ref.htm文件中引用BeRef.gif文件時其相對路徑如下：
　　../SubDir2/BeRef.gif
　　上面的引用路徑中，”..”代表上一層目錄，所以，/Dir2”代表上一層目錄下的Dir2子目錄。若使用絕對路徑引用時，則引用路徑如下：　　
/Dir2/BeRer.gif
　　我們再舉一個比較復(fù)雜的例子，來比較一下相對路徑與絕對路徑的使用。假設(shè)在讀者所建立的Web站點中，擁有如下圖的目錄路徑。

　　我們用以一個表格來說明在上圖的情況下，某文件引用另一文件時，所應(yīng)使用的相對路徑與絕對路徑。　　　　

　　上表中比較需要說明的是”../../”所代表的意義。

　　“..”代表上一層目錄，而”../../”所代表的是上一層目錄的上一層目錄。所以，從上表中可以看出，如果引用的文件存在于目前目錄的子目錄中，或者存在于上一層目錄的另一個子目錄中，運用相對路徑是比較方便的。如果不是時，則利用絕對路徑。從上表中，亦可以看出，當被引用的是同一個文件時，引用文件所使用的絕對路徑是一樣的。

引用外部文件(如超鏈接或者插入圖片)時，經(jīng)常會遇到我們的頁面文件跟要引用的目標文件不在同一目錄下的情況，這個時候，就帶來了文件引用路徑的問題。通常情況下，我們將引用的路徑分為兩種情況，絕對路徑和相對路徑。

絕對路徑

概念

絕對路徑是指文件在硬盤上真正存在的路徑，即物理路徑。例如“bg.jpg”這個圖片是存放在硬盤的“D:\work\code\imgs”目錄下，那么， “bg.jpg”這個圖片的絕對路徑就是：

應(yīng)用

通常我們使用絕對路徑，更多應(yīng)用是在定位網(wǎng)絡(luò)資源上，

如：https://image.so.com/i?ie=utf-8&src=hao_360so&q=%E6%95%85%E5%AE%AB%E7%BB%9D%E7%BE%8E%E9%9B%AA%E6%99%AF

使用絕對路徑的缺點

在實際開發(fā)中，我們很少會使用絕對路徑，如果使用“D:\work\code\imgs\bg.jpg”來指定背景圖片的位置，在自己的計算機上瀏覽可能會一切正常，但是上傳到Web服務(wù)器上瀏覽就很有可能不會顯示圖片了。因為上傳到Web服務(wù)器上時，可能整個網(wǎng)站并沒有放在Web服務(wù)器的D盤，有可能是E盤或H盤。即使放在Web服務(wù)器的D盤里，Web服務(wù)器的E盤里也不一定會存在“D:\work\code\imgs\bg.jpg”這個目錄，因此在瀏覽網(wǎng)頁時是不會顯示圖片的