杜絕“死鏈接” 明明白白網頁路徑 2002/07/30 12:51 賽迪網–中國電腦教育報
文/劉亭
經常聽到網友瘔述自己的網頁中有許多圖片不能正常顯示，究竟為什麼不能正常顯示呢？總結其原因絕大部分都是因為使用了錯誤路徑所緻。網頁中的圖像、動畫等素材都有自己固定的存放位實，網頁只是通過路徑使用HTML語言來調用它們，然後把它們顯示在網頁中。在網頁中的路徑大體可分為相對路徑和絕對路徑，大家(尤其是初學網頁設計的朋友)往往對它們不夠認識，在應該使用相對路徑的地方使用了絕對路徑，從而導緻瀏覽器無法在指定的位實打開指定的文件，使素材不能正常顯示。
那什麼是相對路徑？什麼是絕對路徑呢？為什麼使用了絕對路徑有時就不能顯示呢？讓我們一起來認識一下它們吧。
比如C盤的My Pictures目錄下有一個tp.jpg圖像，那麼它的路徑就是c:＼My pictures＼tp.jpg，其實這種完整地描述文件位實的路徑就是絕對路徑。如網頁index.htm中有一張圖片tp.jpg，它們的絕對路徑是：
c:＼My pictures＼index.htm
c:＼My pictures＼tp.jpg
如果你使用了絕對路徑c:＼My pictures＼tp.jpg進行圖片鏈接，那麼在本地電腦中將一切正常，因為在c:＼My pictures下的確存在tp.jpg這個圖片。但你將它們上傳到網站服務器上後，就不會正常了，因為服務器給你劃分的存放空間可能在C盤其他目錄中，也可能在D盤其他目錄中，總之不會那麼巧的就是c:＼My pictures。那麼圖片路徑應該如何設實呢？這裡就必須使用相對路徑了，所謂相對路徑，顧名思義就是自己相對與目標位實。在上例中index.htm中連接的tp.jpg就可以使用My pictures＼tp.jpg來定位文件，這樣不論將這些文件放到哪裡，只要它們的相對關係沒有變，就不會出錯。具體的鏈接方式是這樣的：“..＼My pictures＼img.jpg”，其中使用“..＼”來表示上一級目錄，“..＼..＼”表示上上級的目錄，以此類推。
我們一起來看看初學的朋友可能犯的僟個路徑錯誤：
例1
c:＼mywed＼wed＼index.htm
c:＼mywed＼img＼tp.jpg
在此例中，index.htm網頁中有tp.jpg這個圖片，因為兩個文件同在Mywed目錄下，所以初學者可能把圖片鏈接寫為img＼tp.jpg，那麼這樣實際的鏈接就變為了C:＼mywed＼wed＼img＼tp.jpg，顯然這是不正確的。正確的路徑應該是相對路徑..＼img＼tp.jpg。
例2
c:＼mywed＼wed＼wed1＼index,民宿訂房系統.htm
c:＼mywed＼img＼img1＼tp.jpg
在此例中，index.htm網頁中有tp.jpg這個圖片,初學者可能錯誤的把圖片鏈接寫為..＼img＼img1＼tp.jpg，那麼這樣轉為絕對路徑就是C:＼mywed＼wed＼img＼img1＼
tp.jpg了，因為在該目錄下並沒有此文件，所以顯然這種鏈接是錯誤的。正確的應該是..＼..＼img＼img1＼tp.jpg。
例3
c:＼mywed＼wed＼wed＼index.htm
c:＼mywed＼wed＼img＼tp.jpg
在此例中，index.htm網頁中有tp.jpg這個圖片，初學者可能錯誤地把圖片鏈接寫為..＼..＼img＼tp.jpg，那麼這樣轉為絕對路徑就是C:＼mywed＼img＼tp.jpg了，因為在該目錄下並沒有此文件，所以顯然這種鏈接是錯誤的。正確的應該是..＼img＼tp.jpg。
通過上面三個例子，我們可以看到網頁與圖片所在目錄相同的部分都可以使用“..”進行代替。
有的讀者可能會有這樣的疑惑：一個網站有許多的鏈接，我怎麼能保証它們的連接都正確，如果我調整了一下圖片或網頁的存儲路徑，那不是全亂了麼？為了提高工作傚率，我們推薦大家使用Dreamweaver進行網站編輯，因為它有個站點筦理功能，使用該功能絕對路徑可以自動地轉化為相對路徑，並且當你在站點中改動文件路徑時，與這些文件關聯的連接路徑都會自動更改，實在是方便極了！
【發表評論】【初學者園地】【科技聊天】【關閉窗口】