CSS中用到相對地址和絕對地址,一點解析


首先,明確這兩種方式只是不同索引文件的形式,他們沒有好壞之分。

然后再來區別他們之間的不同之處。

1、相對地址:

顧名思義,相對地址是存在一個參考,即相對於原文件(代碼所處的文件)目前所處的文件夾,用一些規定的符號,來描述其他文件位置的一種表示方式。

1"." --代表目前所在的目錄。如: <img src="./abc.jpg" /> 【ps:這種情況下,一般是直接省略“./”,左邊的地址即可表示為 <img src="abc.jpg" />】

2".." --代表上一層目錄。如:<img src="../abc.jpg" />

3"../../"-- 代表的是上一層目錄的上一層目錄。如:<img src="../../abc.jpg" />

2、絕對地址

D:\Users\hao\Documents\GitHub\Xixi20160512.github.io/index.html

以上就是絕對地址了,由於這種表示方式過於絕對,因此也不做過多引申。

3、實例分析

1: 

c:/website/web/index.htm

c:/website/img/photo.jpg

相對路徑:../img/photo.jpg

 

2

c:/website/web/xz/index.htm

c:/website/img/images/photo.jpg

相對路徑:../../img/images/photo.jpg

 

3

c:/website/web/xz/index.htm

c:/website/web/img/photo.jpg

 

相對地址:../img/photo.jpg

         

以上例子,差不多可以看出相對地址表示文件地址的用法了,其實,到現在還沒有說,這兩種方法的使用場景。什么時候用相對地址,什么時候用絕對地址呢。

4、不同場景下的選擇

由於相對地址是相對於原地址的描述,在將項目文件整體遷移到其他服務器或者電腦上的時候,原來使用的文件地址還是可以用,而這時候絕對地址是不能用的。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM