一、相对路径和绝对路径

相对路径:以引用文件之网页所在位置为参考基础,而建立出的目录路径。因此,当保存于不同目录的网页引用同一个文件时,所使用的路径将不相同,故称之为相对。

绝对路径:以Web站点根目录为参考基础的目录路径。之所以称为绝对,意指当所有网页引用同一个文件时,所使用的路径都是一样的。

  其实绝对路径与相对路径的不同处,只在于描述目录路径时,所采用的参考点不同。由于对网站上所有文件而言,根目录这个参考点对所有文件都是一样的,因此,运用以根目录为参考点的路径描述方式才会被称之为绝对路径。

二、以下为建立路径所使用的几个特殊符号,及其所代表的意义。

  "."—代表目前所在的目录。

  ".."—代表上一层目录。

  "/"—代表根目录。

三、我们假设读者所建立的Web站点拥有如下图所示目录路径。

1、例如:

    

(1)假若要在Ref.htm文件中引用BeRef.gif文件时,其相对路径如下:

  ./SubDir2/BeRef.gif

  上面的引用路径中,"."代表目前的目录(Dir1),所以"./SubDir2"代表目前目录下的SubDir2。其实,也可以省略"./"直接用下这个方式引用。

  SubDir2/BeRef.gif

(2)若使用绝对路径以根目录为参考点引用该文件时,引用路径如下:

  /Dir1/SubDir2/BeRef.gif

2、如果Web站点的目录之结构如下图时

   

引用BeRef.gif文件的相对路径又是如何呢?

假若要在Ref.htm文件中引用BeRef.gif文件时其相对路径如下:

   ../SubDir2/BeRef.gif

  上面的引用路径中,".."代表上一层目录,所以,/Dir2"代表上一层目录下的Dir2子目录。若使用绝对路径引用时,则引用路径如下:

  /Dir2/BeRer.gif

3、我们再举一个比较复杂的例子,来比较一下相对路径与绝对路径的使用。假设在读者所建立之Web站点中,拥有如下图的目录路径。

  

我们用以一个表格来说明在上图的情况下,某文件引用另一文件时,所应使用的相对路径与绝对路径。

  

上表中比较需要说明的是"../../"所代表的意义。

".."代表上一层目录,而"../../"所代表的是上一层目录的上一层目录。所以,从上表中可以看出,如果引用的文件存在于目前目录的子目录中,或者存在于上一层目录的 另一个子目录中,运用相对路径是比较方便的。如果不是时,则干脆利用绝对路径,还比较省事。从上表中,亦可以看出,当被引用的是同一个文件时,引用文件所使用的绝对路径是一样的。

基础 HTML之目录问题(相对路径和绝对路径区别)的更多相关文章

  1. 9月5日网页基础知识 通用标签、属性(body属性、路径、格式控制) 通用标签(有序列表、无序列表、常用标签)(补)

    网页基础知识 一.HTML语言 HTML语言翻译汉语为超文本标记语言. 二.网页的分类 1.静态页面:在静态页面中修改网页内容实际上就是修改网页原代码,不能从后台操作,数据来只能来源于原于代码.静态网 ...

  2. CentOS个人目录下中文路径转英文路径

    CentOS个人目录下中文路径转英文路径 如果安装了中文版到CentOS之后,root目录及home目录下会出现中文到路径名,如"桌面"."文档"," ...

  3. 自建目录中jsp页面访问servlet路径出错404

    ---恢复内容开始--- 自建目录中jsp页面访问servlet路径出错404 使用eclipse建立的项目,总是会遇到路径问题,比如jsp页面访问servlet,jsp在默认的路径.jsp在自建目录 ...

  4. Linux基础学习:目录配置

    Linux 目录配置标准:FHS FHS:即Filesystem Hierarchy Stabdard,文件配置标准.其主要目的是希望用户可以了解已安装软件通常放置在哪个目录下. FHS根据文件系统使 ...

  5. php快速无限遍历递归文件夹目录、子文件,支持绝对路径和相对路径,支持返回生成数组

    支持无限极遍历子文件及文件夹,支持绝对路径和相对路径! 函数说明:array glob ( string $pattern [, int $flags ] )功能:寻找与模式匹配的文件路径,返回包含匹 ...

  6. webpack安装包的时候 1程序目录不要在C盘 2路径不要有中文 3用cnpm

    webpack安装包的时候 1程序目录不要在C盘 2路径不要有中文 3用cnpm

  7. 【Linux学习】Linux文件系统2—linux常用目录结构、绝对路径、相对路径

    Linux文件系统2-linux常用目录结构.绝对路径.相对路径 一. 常见目录结构总结 Linux目录结构就是"树形结构",常见的目录结构: /bin  系统需要的命令位于此目录 ...

  8. Linux菜鸟起飞之路【四】绝对路径、相对路径及常用目录

    一.绝对路径与相对路径 Linux操作系统中存在着两种路径:绝对路径和相对路径.我们在访问文件或文件夹的时候,其实都是通过路径来操作的.两种路径在实际操作中能起到同等的作用. 在开始具体介绍之前,我们 ...

  9. 17-Ubuntu-文件和目录命令-切换目录-相对路径和绝对路径

    1.相对路径: 在输入路径时,最前面不是/或者~,表示相对当前目录所在的目录位置. 例:当前桌面目录下,通过相对路径切换到桌面目录下的Entertainment目录 2.绝对路径: 在输入路径时,最前 ...

随机推荐

  1. Oracle Database does not provide any supplemental logging, which means that by default LogMiner is not usable

    写在前面,在研究Oracle logmnr 的时候看到 http://www.askmaclean.com/archives/dbms_logmnr-unsupported-sqlredo.html ...

  2. python初准备:安装easy_install和pip

    安装easy_install wget http://peak.telecommunity.com/dist/ez_setup.py python ez_setup.py 安装pip wget htt ...

  3. R中逻辑运算

    一.是否相等的判断的方法 (1)判断字符串是否相等is.null(x) (2)判断x的每个元素是否在y中出现: x %in% y (3)判断判断每个相对应的元素是否相等: x == y (4)判断近似 ...

  4. Oracle删除所有表

    Oracle 清理用户所有的表 PLSQL中执行语句 select 'drop '||object_type||' '||object_name||';' from user_objects; 结果集 ...

  5. MongoDB开发应用实战

    http://special.csdn.net/mongodb/ http://www.csdn.net/article/2011-03-21/294271 http://blog.itpub.net ...

  6. Jquery 操作Html 控件 CheckBox、Radio、Select 控件

    在使用 Javascript 编写前台脚本的时候,经常会操作 Html 控件,比如 checkbox.radio.select,用 Jquery 库操作其他会方便很多,下面用Jq对这些控件的操作进行一 ...

  7. Android ListView(Selector 背景图片)

    listview0.xml <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmln ...

  8. IBInspectable的使用

    IBInspectable的使用 创建一个分类 定义属性 把此分类的头文件引入到pch里面  此时查看属性面板  就有了可以供我们勾选的选项 在.m中实现一下set和get方法

  9. C++类中静态变量和静态方法使用介绍!

    原链接:http://www.ecoviews.cn/net/archives/216.html 静态成员的提出是为了解决数据共享的问题.实现共享有许多方法,如:设置全局性的变量或对象是一种方法.但是 ...

  10. 简单的信誉算法 js处理

    $(document).ready(function(){ // 初始化 var credit = "{sh:$info.credit}"; var res = getCredit ...