CSS相对地址与绝对地址

一、定义


   相对路径:当前在windows目录下.就可以把现在的当前目录给省略直接写后面的路径.

   绝对路径:不管现在在那个目录下.都是以根目录开始写路径。


二、作用


       相对路径和绝对路径都可相互转换,转换时候注意正确路径即可,作用在于有效链接路径。


三、与CSS关系


   1、我们在CSS中引入图片地址的时候就可能用到相对路径与绝对路径


   2、我们在DIV+CSS的html中在HTML引入CSS文件、引入添加图片的时候就会用到相对路径与绝对路径


四、特殊符号及代表的意义


1、相对路径


1"." --代表目前所在的目录。如:

2".." --代表上一层目录。如:

3"../../"-- 代表的是上一层目录的上一层目录。如:


2、绝对路径


1"/" --代表根目录。如:

2"D:/abc/"-- 代表根目录,绝对路径。


  注意:在使用相对路径时,我们用符号“.”来表示当前目录,用符号“..”来表示当前目录的父目录。


五、实例讲解


注意:所有例子中都是index.htm文件中联接有一张图片photo.jpg。

1 

c:/website/web/index.htm

c:/website/img/photo.jpg

CSS相对地址与绝对地址_第1张图片

相对路径:../img/photo.jpg


2

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

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

CSS相对地址与绝对地址_第2张图片

相对路径:../../img/images/photo.jpg


3

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

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

CSS相对地址与绝对地址_第3张图片


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

         

   通过以上的例子可以发现,在把绝对路径转化为相对路径的时候,两个文件绝对路径中相同的部分都可以忽略,不做考虑。只要考虑他们不同之处就可以了

 

 


你可能感兴趣的:(【,BS,历,程】)