相对路径、绝对路径

若是您刚刚开始接触网页设计,是否是常常发生这样的问题呢?作好的网页在本身机器上能够正常浏览,而把页面传到服务器上就老是出现看不到图片,css样式表失效等错误。
  这种状况下多半是因为你使用了错误的路径,在应该使用相对路径的地方使用了绝对路径,致使浏览器没法在指定的位置打开指定的文件。
  下面咱们就来谈一下最让初学者头疼的相对路径与绝对路径的区别问题。css

  什么是绝对路径:
  你们都知道,在咱们平时使用计算机时要找到须要的文件就必须知道文件的位置,而表示文件的位置的方式就是路径,例如只要看到这个路径:c:/website/img/ g咱们就知道 g文件是在c盘的website目录下的img子目录中。相似于这样完整的描述文件位置的路径就是绝对路径。咱们不须要知道其余任何信息就能够根据绝对路径判断出文件的位置。而在网站中相似以
  另外,在网站的应用中,一般咱们使用"/"来表示根目录,/img/ g就表示 g文件在这个网站的根目录上的img目录里。可是这样使用对于初学者来讲是具备风险性的,由于要知道这里所指的根目录并非你的网站的根目录,而是你的网站所在的服务器的根目录,所以当网站的根目录与服务器根目录不一样时,就会发生错误。web

  什么是相对路径:
  让咱们先来分析一下为何会发生图片不能正常显示的状况。举一个例子,如今有一个页面 m,在这个页面中联接有一张图片 g。他们的绝对路径以下:
  c:/website/ m
  c:/website/img/ g
  若是你使用绝对路径c:/website/img/ g,那么在本身的计算机上将一切正常,由于确实能够在指定的位置即c:/website/img/ g上找到 g文件,可是当你将页面上传到网站的时候就极可能会出错了,由于你的网站可能在服务器的c盘,可能在d盘,也可能在aa目录下,更可能在bb目录下,总之没有理由会有c:/website/img/ g这样一个路径。那么,在 m文件中要使用什么样的路径来定位 g文件呢?对,应该是用相对路径,所谓相对路径,顾名思义就是本身相对与目标位置。在上例中 m中联接的 g可使用img/ g来定位文件,那么不论将这些文件放到哪里,只要他们的相对关系没有变,就不会出错。
  另外咱们使用“../”来表示上一级目录,“../../”表示上上级的目录,以此类推。(学习过dos的朋友可能更容易理解)
  再看几个例子,注意全部例子中都是 m文件中联接有一张图片 g。
  例:
  c:/website/web/ m
  c:/website/img/ g
  在此例中 m中联接的 g应该怎样表示呢?
  错误写法:img/ g
  这种写法是不正确的,在此例中,对于 m文件来讲img/ g所表明的绝对路径是:c:/website/web/img/ g,显然不符合要求。
  正确写法:使用../img/ g的相对路径来定位文件
  例:
  c:/website/web/xz/ m
  c:/website/img/images/ g
  在此例中 m中联接的 g应该怎样表示呢?
  错误写法:../img/images/ g
  这种写法是不正确的,在此例中对于 m文件来讲../img/images/ g所表明的绝对路径是:c:/website/web/img/images/ g。
  正确写法:可使用../../img/images/ g的相对路径来定位文件
  例:
  c:/website/web/xz/ m
  c:/website/web/img/ g
  在此例中 m中联接的 g应该怎样表示呢?
  错误写法:../../img/ g
  这种写法是不正确的,在此例中对于 m文件来讲../../img/ g所表明的绝对路径是:c:/website/img/ g。
  正确写法:可使用../img/ g的相对路径来定位文件浏览器

  总结:经过以上的例子能够发现,在把绝对路径转化为相对路径的时候,两个文件绝对路径中相同的部分均可以忽略,不作考虑。只要考虑他们不一样之处就能够了。服务器

  如何修改样式表的路径:
  使用文本编辑器打开htm文件,查看源代码,在源代码的开头部分......标记中间找到。“Href=”后面的内容就是css的路径,咱们能够根据以上的知识进行相对路径的转换。
  例:
  c:/website/web/xz/ m
  c:/website/css/test.css
  在此例中 m中联接test.css文件,可使用../../css/test.css的相对路径来定位文件,完整的代码标记是:
  错误写法举例:../../../css/test.css
  这种写法是不正确的,在此例中对于 m文件来讲../../../css/test.css所表明的绝对路径是:c:/css/test.css
  最后,为了不在制做网页时出现路径错误,咱们可使用dreamweaver的站点管理功能来管理站点。只要使用菜单命令site-new site新建站点并定义站点目录以后,它将自动的把绝对路径转化为相对路径,而且当你在站点中移动文件的时候,与这些文件关联的链接路径都会自动更改,实在是很是的方便。
--爱问-久久_81编辑器

相关文章
相关标签/搜索